Add Multiple Analysis Style
Instructions
Use the "Add" button to add a predefined circle to the map.
See the JavaScript API for more information.
Source Code
The Javascript code for the above map is:
<script language="Javascript"
src="http://www.locationbox.com.tr/locationbox/services?Key=key&Cmd=APIV2
&Typ=JS"></script>
<script language="JavaScript">
var mapper = new IMapper();
var layer = new ILayer();
function startup() {
mapper.initMap(41.1, 29.1, 6);
mapper.addNavigationPanel();
return;
}
function add() {
var xml_data = "<nsdp_xml>"+
"<table>"+
"<tr><th>IL_ID</th><th>Item 1</th><th>Item 2</th><th>Item 3</th><th>Item 4</th><th>Item 5</th></tr>"+
"<tr><td>10</td><td>500.0</td><td>200.0</td><td>1000.0</td><td>345.0</td><td>100.0</td></tr>"+
"<tr><td>11</td><td>624.0</td><td>275.0</td><td>800.0</td><td>154.0</td><td>199.0</td></tr>"+
"<tr><td>16</td><td>200.0</td><td>396.0</td><td>900.0</td><td>347.0</td><td>40.0</td></tr>"+
"<tr><td>34</td><td>100.0</td><td>458.0</td><td>10.0</td><td>369.0</td><td>70.0</td></tr>"+
"<tr><td>41</td><td>375.0</td><td>10.0</td><td>800.0</td><td>245.0</td><td>51.0</td></tr>"+
"<tr><td>54</td><td>469.0</td><td>999.0</td><td>60.0</td><td>545.0</td><td>150.0</td></tr>"+
"<tr><td>59</td><td>50.0</td><td>167.0</td><td>200.0</td><td>45.0</td><td>142.0</td></tr>"+
"<tr><td>77</td><td>400.0</td><td>234.0</td><td>1500.0</td><td>845.0</td><td>96.0</td></tr>"+
"<tr><td>81</td><td>100.0</td><td>555.0</td><td>100.0</td><td>35.0</td><td>144.0</td></tr>"+
"</table>"+
"</nsdp_xml>";
layer1.setNSDP("iller","STY",xml_data);
var slices = new Array(5);
slices[0] = mapper.createPieSlice("Item 1", "#ffff00");
slices[1] = mapper.createPieSlice("Item 2", "#000000");
slices[2] = mapper.createPieSlice("Item 3", "#ff00ff");
slices[3] = mapper.createPieSlice("Item 4", "#0000ff");
slices[4] = mapper.createPieSlice("Item 5", "#ffffff");
var piechart = mapper.createPieChartStyle("pie", slices , true , 90 , "CW", 80 ,
"kilometer" , {max:20,min:1});
layer1.addSecondaryStyle("iller",piechart);
var bars = new Array(5);
bars[0] = mapper.createBar("Item 1", "#FF0000");
bars[1] = mapper.createBar("Item 2", "#FFC800");
bars[2] = mapper.createBar("Item 3", "#0000FF");
bars[3] = mapper.createBar("Item 4", "#00FF00");
bars[4] = mapper.createBar("Item 5", "#00FFFF");
var barchart = mapper.createBarChartStyle("bar", bars, 160 , 160 ,
"kilometer", true, {max:20, min:1});
layer1.addSecondaryStyle("iller",barchart);
return;
}
function remove() {
layer1.removeLayer();
return;
}
</script>
Buttons:
<a href="javascript:add()"><img src="images/add.gif" border=0></a>
<a href="javascript:remove()"><img src="images/remove.gif" border=0></a>
Download working pageRemember that you need to use your key code as Key attribute.