wp-gpx-maps/WP-GPX-Maps.js

130 lines
3.4 KiB
JavaScript
Raw Normal View History

2011-12-14 13:05:57 +00:00
var loc_en =
{
"length" : "Length",
"altitude": "Altitude"
};
var loc_it =
{
"length" : "Lunghezza",
"altitude": "Altitudine"
};
var loc = loc_en;
2011-12-20 17:17:24 +00:00
2011-12-20 17:38:41 +00:00
var t;
var funqueue = [];
var wrapFunction = function(fn, context, params) {
return function() {
fn.apply(context, params);
};
2011-12-20 17:17:24 +00:00
}
2011-12-14 10:35:25 +00:00
function wpgpxmaps(targhetId,mapType,mapData,graphData)
2011-12-20 17:17:24 +00:00
{
2011-12-20 17:38:41 +00:00
funqueue.push( wrapFunction(_wpgpxmaps, this, [targhetId,mapType,mapData,graphData]));
unqueue();
}
function unqueue()
{
if ((google == undefined || google.maps == undefined || google.visualization == undefined))
2011-12-20 17:17:24 +00:00
{
2011-12-20 17:38:41 +00:00
t = setTimeout("unqueue()",200);
}
else
{
while (funqueue.length > 0) {
(funqueue.shift())();
2011-12-20 17:17:24 +00:00
}
}
}
function _wpgpxmaps(targhetId,mapType,mapData,graphData)
2011-12-14 10:35:25 +00:00
{
2011-12-15 19:00:25 +00:00
var el = document.getElementById("wpgpxmaps_" + targhetId);
var el_map = document.getElementById("map_" + targhetId);
var el_chart = document.getElementById("chart_" + targhetId);
2011-12-14 10:35:25 +00:00
switch (mapType)
{
case 'TERRAIN': { mapType = google.maps.MapTypeId.TERRAIN; break;}
case 'SATELLITE': { mapType = google.maps.MapTypeId.SATELLITE; break;}
case 'ROADMAP': { mapType = google.maps.MapTypeId.ROADMAP; break;}
default: { mapType = google.maps.MapTypeId.HYBRID; break;}
}
var mapOptions = {
mapTypeId: mapType
};
var map = new google.maps.Map(el_map, mapOptions);
if (graphData!= '')
{
var data = new google.visualization.DataTable();
2011-12-14 13:05:57 +00:00
data.addColumn('number', loc['length']);
data.addColumn('number', loc['altitude']);
2011-12-14 10:35:25 +00:00
data.addRows(graphData);
var chart = new google.visualization.AreaChart(el_chart);
var options = { curveType: "function",
strictFirstColumnType: true,
2011-12-14 13:05:57 +00:00
hAxis : {format : '#,###m', title : loc['length']},
vAxis : {format : '#,###m', title : loc['altitude']},
2011-12-14 10:35:25 +00:00
legend : {position : 'none'},
chartArea: {left:70,top:10,width:"100%",height:"75%"}
};
chart.draw(data, options);
google.visualization.events.addListener(chart, 'onmouseover', function (e) {
var r = e['row'];
if (marker)
{
var point = getItemFromArray(mapData,r)
2011-12-20 15:37:26 +00:00
marker.setPosition(new google.maps.LatLng(point[0],point[1])); marker.setTitle("Current Position");
2011-12-14 10:35:25 +00:00
}
});
google.visualization.events.addListener(chart, 'onmouseout', function (e) {
if (marker)
{
if (chart.getSelection() != '')
{
var r = chart.getSelection()[0]['row'];
var point = getItemFromArray(mapData,r)
2011-12-20 15:37:26 +00:00
marker.setPosition(new google.maps.LatLng(point[0], point[1])); marker.setTitle("Graph Selection");
2011-12-14 10:35:25 +00:00
}
}
});
2011-12-20 15:37:26 +00:00
} else { el_chart.style.display='none'; }
if (mapData != '') {
2011-12-14 10:35:25 +00:00
var points = [];
var bounds = new google.maps.LatLngBounds();
for(var i in mapData)
{
var p = new google.maps.LatLng(mapData[i][0], mapData[i][1]);
points.push(p);
bounds.extend(p);
}
var poly = new google.maps.Polyline({
path: points,
strokeColor: "#3366cc",
strokeOpacity: .7,
strokeWeight: 4
});
poly.setMap(map);
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
var first = getItemFromArray(mapData,0)
var marker = new google.maps.Marker({
position: new google.maps.LatLng(first[0], first[1]),
2011-12-20 15:37:26 +00:00
title:"Start"
2011-12-14 10:35:25 +00:00
});
marker.setMap(map);
2011-12-20 15:37:26 +00:00
}
2011-12-14 10:35:25 +00:00
}
function getItemFromArray(arr,index)
{
try
{
return arr[index];
}
catch(e)
{
return [0,0];
}
}