This example is a jupyter notebook adoption from the small desktop application I wrote some time ago, to analyze weather data (rain, temperature) from swiss weather stations from year 1864 - 2013.
It shows the capabilities of analyzing and visualizing data using the J array programming language.
The ineractive version of this notebook shows also the capabilities of the new jkernel which enables interactive HTML content.
In [1]:
NB. Required library scripts
require 'tables/dsv plot'
NB. Utility verbs
chop =: 4 : '(y#i.#y)</.x'
desc =: 3 : '>(I. (<y) E. 0{keys) { 1{keys'
gets =: 4 : '(I. (<y) E. 0{|:x){x'
gety =: 4 : '(I. (<y) E. 1{|:x){x'
getm =: 4 : '(I. (<y) E. 2{|:x){x'
lreg =: 4 : 'y %. 1 ,. x'
NB. Read and format raw data
data =: ('|';'') readdsv jpath '~user/Jupyter_Notebook_J_Example_Data/RainTemp_1864-2013.txt'
data =: (I. (<'PAY') i. 0{|:data){data NB. Remove PAY (no data)
stat =: ('|';'') readdsv jpath '~user/Jupyter_Notebook_J_Example_Data/Weather_Stations.txt'
keys =: (2,$(~.0{|:data))$(~.0{|:data),(I.((1}.0{|:stat)e.(~.0{|:data))){1}.1{|:stat
spym =: |: ((#data),2) $ (,/>1{|:data) chop ((2*#data) $ 4 2)
data =: (0{|:data),.(0{spym),.(1{spym),.(". each 2{|:data),.(". each 3{|:data)
NB. Labels and X-Axis
yeal =: ": (".>1{0{data)+10*i.1+(>.(((".>1{0{_1{.data)-(".>1{0{data))%10))
yeax =: ": i. # ". yeal
monl =: 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec'
monx =: ": i. 12
NB. 3D plot view parameters
vpox =: 2.8
vpoy =: _4
vpoz =: 2.4
In [2]:
NB. Define HTML form
html_form =: 0 : 0
<html>
<head>
<script type="text/javascript">
// Function plot selected data
function doplot()
{
// Get document elements
var wsta_ele = document.getElementById("wsta");
var mont_ele = document.getElementById("mont");
// Get value of the elements
var wsta_val = wsta_ele.options[wsta_ele.selectedIndex].value;
var mont_val = mont_ele.options[mont_ele.selectedIndex].value;
// Build cell text (J commands)
var cell_txt = "";
cell_txt += "NB. Filter data" + "\n";
cell_txt += "d =: (data gets '" + wsta_val + "') getm '" + mont_val + "'" + "\n";
cell_txt += "\n";
cell_txt += "NB. Extract data for visualization, and calculate linear regression" + "\n";
cell_txt += "ra3d =: (150,12)$,/>3{|:(data gets 'SMA')" + "\n";
cell_txt += "te3d =: (150,12)$,/>4{|:(data gets 'SMA')" + "\n";
cell_txt += "rain =: ,/>3{|:d" + "\n";
cell_txt += "temp =: ,/>4{|:d" + "\n";
cell_txt += "rreg =: ((1{((i.#rain) lreg rain))*(i.#rain))+(0{((i.#rain) lreg rain))" + "\n";
cell_txt += "treg =: ((1{((i.#temp) lreg temp))*(i.#temp))+(0{((i.#temp) lreg temp))" + "\n";
cell_txt += "\n";
cell_txt += "NB. Set some plot options" + "\n";
cell_txt += "xtin =: \":((i.16)*((#d)%15))" + "\n";
cell_txt += "xlan =: yeal" + "\n";
cell_txt += "xtit =: \":((i.16)*((#d)%15))" + "\n";
cell_txt += "xlat =: yeal" + "\n";
cell_txt += "\n";
cell_txt += "NB. Plot/Visualize data in 4 sub-plots" + "\n";
cell_txt += "\n";
cell_txt += "pd 'reset'" + "\n";
cell_txt += "pd 'sub 2 2'" + "\n";
cell_txt += "\n";
cell_txt += "pd 'new'" + "\n";
cell_txt += "pd 'title Rain " + wsta_val + " / " + mont_val + "'" + "\n";
cell_txt += "pd 'xticpos ',xtin" + "\n";
cell_txt += "pd 'xlabel ',xlan" + "\n";
cell_txt += "pd rain" + "\n";
cell_txt += "pd rreg" + "\n";
cell_txt += "\n";
cell_txt += "pd 'new'" + "\n";
cell_txt += "pd 'title Temperature " + wsta_val + " / " + mont_val + "'" + "\n";
cell_txt += "pd 'xticpos ',xtit" + "\n";
cell_txt += "pd 'xlabel ',xlat" + "\n";
cell_txt += "pd temp" + "\n";
cell_txt += "pd treg" + "\n";
cell_txt += "\n";
cell_txt += "pd 'new'" + "\n";
cell_txt += "pd 'titlecolor white'" + "\n";
cell_txt += "pd 'title Rain'" + "\n";
cell_txt += "pd 'yticpos ',monx" + "\n";
cell_txt += "pd 'ylabel ',monl" + "\n";
cell_txt += "pd 'xticpos ',\":((i.16)*((#ra3d)%15))" + "\n";
cell_txt += "pd 'xlabel ',yeal" + "\n";
cell_txt += "pd 'type surface'" + "\n";
cell_txt += "pd 'backcolor black'" + "\n";
cell_txt += "pd 'axiscolor white'" + "\n";
cell_txt += "pd 'labelcolor white'" + "\n";
cell_txt += "pd 'bandcolor |.bgclr'" + "\n";
cell_txt += "pd 'viewpoint ',\":(vpox,vpoy,vpoz)" + "\n";
cell_txt += "pd ra3d" + "\n";
cell_txt += "\n";
cell_txt += "pd 'new'" + "\n";
cell_txt += "pd 'keyfont arial 4'" + "\n";
cell_txt += "pd 'titlecolor white'" + "\n";
cell_txt += "pd 'title Temperature'" + "\n";
cell_txt += "pd 'yticpos ',monx" + "\n";
cell_txt += "pd 'ylabel ',monl" + "\n";
cell_txt += "pd 'xticpos ',\":((i.16)*((#te3d)%15))" + "\n";
cell_txt += "pd 'xlabel ',yeal" + "\n";
cell_txt += "pd 'type surface'" + "\n";
cell_txt += "pd 'backcolor black'" + "\n";
cell_txt += "pd 'axiscolor white'" + "\n";
cell_txt += "pd 'labelcolor white'" + "\n";
cell_txt += "pd 'viewpoint ',\":(vpox,vpoy,vpoz)" + "\n";
cell_txt += "pd te3d" + "\n";
cell_txt += "\n";
cell_txt += "NB. Set plot size" + "\n";
cell_txt += "CANVAS_DEFSIZE_jwplot_ =: 1000 600" + "\n";
cell_txt += "\n";
cell_txt += "pd 'show'"
// Insert a cell below the current cell
if(IPython.notebook.get_cells().length > 4)
{
var cell_new = IPython.notebook.get_cells()[4];
}
else
{
var cell_new = IPython.notebook.insert_cell_below();
}
// Set cell text
cell_new.set_text(cell_txt);
// Execute cell
cell_new.execute();
}
</script>
</head>
<body>
<div style="height:200px; background-color:#ffffee;">
<div style="height:1px; margin-top:10px; margin-left:10px;">
</div>
<div style="height:50px; margin-top:10px; margin-left:10px;">
<h2>Select Data to plot</h2>
</div>
<div style="width:350px; height:50px; margin-left:10px;">
<label style="float:left;">Select Weather Station:</label>
<select id="wsta" style="float:right;">
<option value="BAS">Basel/Binningen</option>
<option value="BER">Bern/Zollikofen</option>
<option value="CHM">Chaumont</option>
<option value="CHD">Chateau-d'Oex</option>
<option value="GSB">Col du Grand St.Bernard</option>
<option value="DAV">Davos</option>
<option value="ENG">Engelberg</option>
<option value="GVE">Geneve-Cointrin</option>
<option value="LUG">Lugano</option>
<option value="SIA">Segl-Maria</option>
<option value="SIO">Sion</option>
<option value="SAE">Santis</option>
<option value="SMA">Zurich/Fluntern</option>
</select>
</div>
<div style="width:350px; height:50px; margin-left:10px;">
<label style="float:left;">Select Month:</label>
<select id="mont" style="float:right;">
<option value="01">January</option>
<option value="02">February</option>
<option value="03">March</option>
<option value="04">April</option>
<option value="05">May</option>
<option value="06">June</option>
<option value="07">July</option>
<option value="08">August</option>
<option value="09">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
<div style="margin-left:10px;">
<input type="button" value="Plot Selected Data" onclick="doplot()"></input>
</div>
</div>
</body>
</html>
)
NB. Run HTML form
html_form
In [4]:
NB. Filter data
d =: (data gets 'SMA') getm '12'
NB. Extract data for visualization, and calculate linear regression
ra3d =: (150,12)$,/>3{|:(data gets 'SMA')
te3d =: (150,12)$,/>4{|:(data gets 'SMA')
rain =: ,/>3{|:d
temp =: ,/>4{|:d
rreg =: ((1{((i.#rain) lreg rain))*(i.#rain))+(0{((i.#rain) lreg rain))
treg =: ((1{((i.#temp) lreg temp))*(i.#temp))+(0{((i.#temp) lreg temp))
NB. Set some plot options
xtin =: ":((i.16)*((#d)%15))
xlan =: yeal
xtit =: ":((i.16)*((#d)%15))
xlat =: yeal
NB. Plot/Visualize data in 4 sub-plots
pd 'reset'
pd 'sub 2 2'
pd 'new'
pd 'title Rain SMA / 12'
pd 'xticpos ',xtin
pd 'xlabel ',xlan
pd rain
pd rreg
pd 'new'
pd 'title Temperature SMA / 12'
pd 'xticpos ',xtit
pd 'xlabel ',xlat
pd temp
pd treg
pd 'new'
pd 'titlecolor white'
pd 'title Rain'
pd 'yticpos ',monx
pd 'ylabel ',monl
pd 'xticpos ',":((i.16)*((#ra3d)%15))
pd 'xlabel ',yeal
pd 'type surface'
pd 'backcolor black'
pd 'axiscolor white'
pd 'labelcolor white'
pd 'bandcolor |.bgclr'
pd 'viewpoint ',":(vpox,vpoy,vpoz)
pd ra3d
pd 'new'
pd 'keyfont arial 4'
pd 'titlecolor white'
pd 'title Temperature'
pd 'yticpos ',monx
pd 'ylabel ',monl
pd 'xticpos ',":((i.16)*((#te3d)%15))
pd 'xlabel ',yeal
pd 'type surface'
pd 'backcolor black'
pd 'axiscolor white'
pd 'labelcolor white'
pd 'viewpoint ',":(vpox,vpoy,vpoz)
pd te3d
NB. Set plot size
CANVAS_DEFSIZE_jwplot_ =: 1000 600
pd 'show'
In [ ]: