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

1281 lines
33 KiB
JavaScript
Raw Normal View History

2011-12-24 14:37:05 +00:00
/*
Plugin Name: WP-GPX-Maps
Plugin URI: http://www.devfarm.it/
Description: Draws a gpx track with altitude graph
Version: 1.3.3
Author: Bastianon Massimo
Author URI: http://www.pedemontanadelgrappa.it/
2011-12-24 14:37:05 +00:00
*/
2011-12-29 09:54:00 +00:00
(function ( $ ) {
2012-03-17 11:46:00 +00:00
var infowindow;
var CustomMarker;
2012-03-17 11:46:00 +00:00
2012-04-12 14:49:22 +00:00
CustomMarker = function( map, latlng, src, img_w, img_h) {
this.latlng_ = latlng;
this.setMap(map);
this.src_ = src;
this.img_w_ = img_w;
this.img_h_ = img_h;
}
2012-03-18 10:44:11 +00:00
2012-04-12 14:49:22 +00:00
CustomMarker.prototype = new google.maps.OverlayView();
CustomMarker.prototype.draw = function() {
2012-06-04 12:31:21 +00:00
var me = this;
// Check if the el has been created.
var el = this.img_;
if (!el) {
this.img_ = document.createElement('img');
el = this.img_;
el.style.cssText = "width:"+(this.img_w_/3)+"px;height:"+(this.img_h_/3)+"px;";
el.setAttribute("class", "myngimages");
el.setAttribute("lat",this.latlng_.lat());
el.setAttribute("lon",this.latlng_.lng());
el.src=this.src_;
google.maps.event.addDomListener(el, "click", function(event) {
google.maps.event.trigger(me, "click", el);
});
google.maps.event.addDomListener(el, "mouseover", function(event) {
var _t = el.style.top.replace('px','');
var _l = el.style.left.replace('px','');
jQuery(el).animate({
height: me.img_h_,
width : me.img_w_,
top : _t - (me.img_h_ / 3),
left : _l - (me.img_w_ / 3),
2012-07-06 15:40:38 +00:00
'z-index' : 100
2012-06-04 12:31:21 +00:00
}, 100);
});
google.maps.event.addDomListener(el, "mouseout", function(event) {
jQuery(el).animate({
height: me.img_h_ / 3,
width: me.img_w_ / 3,
top : me.orig_top,
left : me.orig_left,
'z-index' : 1
}, 100);
});
// Then add the overlay to the DOM
var panes = this.getPanes();
panes.overlayImage.appendChild(el);
}
2012-03-17 11:46:00 +00:00
2012-06-04 12:31:21 +00:00
// Position the overlay
var point = this.getProjection().fromLatLngToDivPixel(this.latlng_);
if (point) {
el.style.left = point.x + 'px';
el.style.top = point.y + 'px';
this.orig_left = point.x;
this.orig_top = point.y;
}
2012-04-12 14:49:22 +00:00
};
2012-03-17 11:46:00 +00:00
2012-04-12 14:49:22 +00:00
CustomMarker.prototype.remove = function() {
2012-06-04 12:31:21 +00:00
// Check if the overlay was on the map and needs to be removed.
if (this.img_) {
this.img_.parentNode.removeChild(this.img_);
this.img_ = null;
}
2012-04-12 14:49:22 +00:00
};
$.fn.wpgpxmaps = function( params ) {
2012-03-17 11:46:00 +00:00
var targetId = params.targetId;
var mapType = params.mapType;
var mapData = params.mapData;
var graphDist = params.graphDist;
var graphEle = params.graphEle;
var graphSpeed = params.graphSpeed;
var graphHr = params.graphHr;
var graphAtemp = params.graphAtemp;
var graphCad = params.graphCad;
var graphGrade = params.graphGrade;
var waypoints = params.waypoints;
var unit = params.unit;
var unitspeed = params.unitspeed;
var color1 = params.color1;
var color2 = params.color2;
var color3 = params.color3;
var color4 = params.color4;
var color5 = params.color5;
var color6 = params.color6;
var color7 = params.color7;
var chartFrom1 = params.chartFrom1;
var chartTo1 = params.chartTo1;
var chartFrom2 = params.chartFrom2;
var chartTo2 = params.chartTo2;
var startIcon = params.startIcon;
var waypointIcon = params.waypointIcon;
var endIcon = params.endIcon;
var currentIcon = params.currentIcon;
var zoomOnScrollWheel = params.zoomOnScrollWheel;
var lng = params.langs;
var pluginUrl = params.pluginUrl;
var usegpsposition = params.usegpsposition;
var currentpositioncon= params.currentpositioncon;
2012-06-21 13:29:17 +00:00
// Unit of measure settings
var l_s;
var l_x;
var l_y;
var l_grade = { suf : "%", dec : 1 };
var l_hr = { suf : "", dec : 0 };
var l_cad = { suf : "", dec : 0 };
var el = document.getElementById("wpgpxmaps_" + targetId);
var el_map = document.getElementById("map_" + targetId);
var el_chart = document.getElementById("chart_" + targetId);
var el_report = document.getElementById("report_" + targetId);
var el_osm_credits = document.getElementById("wpgpxmaps_" + targetId + "_osm_footer");
var mapWidth = el_map.style.width;
var mapTypeIds = [];
for(var type in google.maps.MapTypeId) {
mapTypeIds.push(google.maps.MapTypeId[type]);
2012-06-21 13:29:17 +00:00
}
mapTypeIds.push("OSM1");
mapTypeIds.push("OSM2");
mapTypeIds.push("OSM3");
mapTypeIds.push("OSM4");
mapTypeIds.push("OSM5");
mapTypeIds.push("OSM6");
var ngImageMarkers = [];
switch (mapType)
2012-06-21 13:29:17 +00:00
{
case 'TERRAIN': { mapType = google.maps.MapTypeId.TERRAIN; break;}
case 'SATELLITE': { mapType = google.maps.MapTypeId.SATELLITE; break;}
case 'ROADMAP': { mapType = google.maps.MapTypeId.ROADMAP; break;}
case 'OSM1': { mapType = "OSM1"; break;}
case 'OSM2': { mapType = "OSM2"; break;}
case 'OSM3': { mapType = "OSM3"; break;}
case 'OSM4': { mapType = "OSM4"; break;}
case 'OSM5': { mapType = "OSM5"; break;}
case 'OSM6': { mapType = "OSM6"; break;}
default: { mapType = google.maps.MapTypeId.HYBRID; break;}
2012-06-21 13:29:17 +00:00
}
if ( mapType == "TERRAIN" || mapType == "SATELLITE" || mapType == "ROADMAP" )
{
// google maps
} else {
// Show OpenStreetMaps credits
$(el_osm_credits).show();
}
2014-07-14 07:48:30 +00:00
var map = new google.maps.Map(el_map, {
mapTypeId: mapType,
scrollwheel: (zoomOnScrollWheel == 'true'),
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
mapTypeIds: mapTypeIds
}
});
map.mapTypes.set("OSM1", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "OSM",
alt : "Open Street Map",
maxZoom: 18
}));
2012-06-21 13:29:17 +00:00
map.mapTypes.set("OSM2", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://a.tile.opencyclemap.org/cycle/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "OCM",
alt : "Open Cycle Map",
maxZoom: 18
}));
2012-06-21 13:29:17 +00:00
map.mapTypes.set("OSM4", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://a.tile2.opencyclemap.org/transport/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "OCM-Tran",
alt : "Open Cycle Map - Transport",
maxZoom: 18
}));
2012-03-17 11:46:00 +00:00
map.mapTypes.set("OSM5", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://a.tile3.opencyclemap.org/landscape/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "OCM-Land",
alt : "Open Cycle Map - Landscape",
maxZoom: 18
}));
2012-07-02 12:51:45 +00:00
map.mapTypes.set("OSM6", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://tile2.maptoolkit.net/terrain/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "MTK-Terr",
alt : "MapToolKit - Terrain",
maxZoom: 18
}));
// FULL SCREEN BUTTON
var controlDiv = document.createElement('div');
controlDiv.style.padding = '5px';
2012-03-17 11:46:00 +00:00
2012-10-30 14:03:16 +00:00
// Set CSS for the control border
var controlUI = document.createElement('img');
controlUI.src = pluginUrl + "/wp-gpx-maps/img/goFullScreen.png";
controlUI.style.cursor = 'pointer';
controlUI.title = lng.goFullScreen;
controlDiv.appendChild(controlUI);
2012-10-30 14:03:16 +00:00
// Setup the click event listeners
google.maps.event.addDomListener(controlUI, 'click', function(event) {
var isFullScreen = (controlUI.isfullscreen == true);
var mapDiv = [ map.getDiv(), map.getDiv().parentNode ];
2012-10-30 14:03:16 +00:00
var center = map.getCenter();
if (isFullScreen)
2012-10-30 14:03:16 +00:00
{
map.setOptions( { scrollwheel : (zoomOnScrollWheel == 'true') } );
jQuery(mapDiv).css("position", 'relative').
css('top', 0).
css("width", controlUI.googleMapWidth).
css("height", controlUI.googleMapHeight).
css("z-index", '');
google.maps.event.trigger(map, 'resize');
map.setCenter(center);
controlUI.src = pluginUrl + "/wp-gpx-maps/img/goFullScreen.png";
controlUI.title = lng.gofullscreen;
2012-10-30 14:03:16 +00:00
}
else
{
map.setOptions( { scrollwheel : true } );
controlUI.googleMapWidth = jQuery(mapDiv).css('width');
controlUI.googleMapHeight = jQuery(mapDiv).css('height');
jQuery(mapDiv).css("position", 'fixed').
css('top', 0).
css('left', 0).
css("width", '100%').
css("height", '100%').
css("z-index", '100');
jQuery("#wpadminbar").each(function(){
jQuery(mapDiv).css('top', jQuery(this).height());
});
google.maps.event.trigger(map, 'resize');
map.setCenter(center);
controlUI.src = pluginUrl + "/wp-gpx-maps/img/exitFullFcreen.png";
controlUI.title = lng.exitFullFcreen;
2012-10-30 14:03:16 +00:00
}
controlUI.isfullscreen = !isFullScreen;
2012-10-30 14:03:16 +00:00
return false;
});
2012-07-02 12:51:45 +00:00
2012-02-15 16:04:18 +00:00
controlDiv.index = 1;
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(controlDiv);
var bounds = new google.maps.LatLngBounds();
var markerCurrentPosition = null;
if ( usegpsposition == "true" )
2012-03-05 07:57:36 +00:00
{
2012-07-02 12:51:45 +00:00
// Try HTML5 geolocation
if(navigator.geolocation) {
2012-03-05 07:57:36 +00:00
navigator.geolocation.getCurrentPosition(function(position) {
// user position
var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
// draw current position marker
markerCurrentPosition = new google.maps.Marker({
position: pos,
map: map,
title: "you",
animation: google.maps.Animation.DROP,
zIndex: 10
});
if (currentpositioncon)
{
markerCurrentPosition.setIcon(currentpositioncon);
}
bounds.extend(pos);
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
}, function() {});
navigator.geolocation.watchPosition(function(position){
// move current position marker
if (markerCurrentPosition != null)
{
markerCurrentPosition.setPosition(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
}
},
function(e){
// some errors
},
{
enableHighAccuracy: false,
timeout: 5000,
maximumAge: 0
});
}
2012-03-05 07:57:36 +00:00
}
2011-12-24 14:37:05 +00:00
// Print WayPoints
if (waypoints != '')
2012-03-05 07:57:36 +00:00
{
var image = new google.maps.MarkerImage('http://maps.google.com/mapfiles/ms/micons/flag.png',
new google.maps.Size(32, 32),
new google.maps.Point(0,0),
new google.maps.Point(16, 32)
);
var shadow = new google.maps.MarkerImage('http://maps.google.com/mapfiles/ms/micons/flag.shadow.png',
new google.maps.Size(59, 32),
new google.maps.Point(0,0),
new google.maps.Point(16, 32)
);
if (waypointIcon!='')
{
image = new google.maps.MarkerImage(waypointIcon);
shadow = '';
}
for (i=0; i < waypoints.length; i++)
{
var lat= waypoints[i][0];
var lon= waypoints[i][1];
addWayPoint(map, image, shadow, lat, lon, waypoints[i][2], waypoints[i][3]);
bounds.extend(new google.maps.LatLng(lat, lon));
}
2012-03-05 07:57:36 +00:00
}
// Print Images
2011-12-29 09:54:00 +00:00
jQuery("#ngimages_" + targetId).attr("style","display:block;position:absolute;left:-50000px");
jQuery("#ngimages_" + targetId + " span").each(function(){
2011-12-29 09:54:00 +00:00
var imageLat = jQuery(this).attr("lat");
var imageLon = jQuery(this).attr("lon");
jQuery("img",this).each(function() {
jQuery(this).load(function(){
2012-07-02 12:51:45 +00:00
var imageUrl = jQuery(this).attr("src");
var img_w = jQuery(this).width();
var img_h = jQuery(this).height();
imageLat = imageLat.replace(",", ".");
imageLon = imageLon.replace(",", ".");
var p = new google.maps.LatLng(imageLat, imageLon);
bounds.extend(p);
var mc = new CustomMarker(map, p, imageUrl, img_w, img_h );
ngImageMarkers.push(mc);
google.maps.event.addListener(mc, "click", function(div) {
var lat = div.getAttribute("lat");
var lon = div.getAttribute("lon");
var a = getClosestImage(lat,lon,targetId).childNodes[0];
if (a)
2012-07-02 12:51:45 +00:00
{
a.click();
2012-07-02 12:51:45 +00:00
}
});
});
if (jQuery(this).width() + jQuery(this).height() > 0)
{
jQuery(this).trigger("load");
2011-12-29 09:54:00 +00:00
}
2012-10-30 14:03:16 +00:00
});
});
/*
// Nextgen Pro Lightbox FIX
var _xx = jQuery("#ngimages_" + targetId + " .nextgen_pro_lightbox");
if (_xx.length > 0)
2012-10-30 14:03:16 +00:00
{
var rnd1 = Math.random().toString(36).substring(7);
var rnd2 = Math.random().toString(36).substring(7);
//get first gallery without images
for (var _temp in galleries) {
var _gal = galleries[_temp];
if (_gal.source == "random_images" && _gal.wpgpxmaps != true )
{
_gal.source == "galleries";
_gal.wpgpxmaps = true;
_transient_id = _temp.replace("gallery_","")
_gal["entity_ids"] = [];
_gal["image_ids"] = [];
_gal["gallery_ids"] = [96];
for (var i=0;i<_xx.length;i++)
{
var __xx = jQuery(_xx[i]);
__xx.attr("data-nplmodal-gallery-id", _transient_id);
_gal["image_ids"].push(__xx.attr("data-image-id"));
}
break;
}
}
2012-10-30 14:03:16 +00:00
}
*/
if ( jQuery("#ngimages_" + targetId + " span").length > 0 )
2012-10-30 14:03:16 +00:00
{
2012-10-30 14:03:16 +00:00
// Set CSS for the control border
var controlUIhi = document.createElement('img');
controlUIhi.src = pluginUrl + "/wp-gpx-maps/img/hideImages.png";
controlUIhi.style.cursor = 'pointer';
controlUIhi.title = lng.hideImages;
controlDiv.appendChild(controlUIhi);
2012-10-30 14:03:16 +00:00
// Setup the click event listeners
google.maps.event.addDomListener(controlUIhi, 'click', function(event) {
var isImagesHidden = (controlUIhi.isImagesHidden == true);
var mapDiv = map.getDiv();
var center = map.getCenter();
if (isImagesHidden)
{
for (var i=0; i<ngImageMarkers.length; i++) {
ngImageMarkers[i].setMap(map);
}
controlUIhi.src = pluginUrl + "/wp-gpx-maps/img/hideImages.png";
controlUIhi.title = lng.hideImages;
}
else
{
for (var i=0; i<ngImageMarkers.length; i++) {
ngImageMarkers[i].setMap(null);
}
controlUIhi.src = pluginUrl + "/wp-gpx-maps/img/showImages.png";
controlUIhi.title = lng.showImages;
}
controlUIhi.isImagesHidden = !isImagesHidden;
2012-10-30 14:03:16 +00:00
return false;
});
2012-06-13 13:14:18 +00:00
2012-02-22 14:29:44 +00:00
}
2012-02-15 16:04:18 +00:00
2012-06-27 13:48:34 +00:00
// Print Track
if (mapData != '')
{
var points = [];
var lastCut=0;
var polylinenes = [];
var polyline_number=0;
var color=0;
for (i=0; i < mapData.length; i++)
{
if (mapData[i] == null)
{
color=color1[polyline_number % color1.length];
var poly = new google.maps.Polyline({
path: points.slice(lastCut,i),
strokeColor: color,
strokeOpacity: .7,
strokeWeight: 4,
map: map
});
polylinenes.push(poly);
lastCut=i;
polyline_number= polyline_number +1;
//var p = new google.maps.LatLng(mapData[i-1][0], mapData[i-1][1]);
//points.push(p);
//bounds.extend(p);
2012-04-07 09:11:37 +00:00
}
else
{
var p = new google.maps.LatLng(mapData[i][0], mapData[i][1]);
points.push(p);
bounds.extend(p);
}
}
if (points.length != lastCut)
{
if ( polyline_number < color1.length)
2012-04-07 09:11:37 +00:00
{
color=color1[polyline_number];
2012-04-07 09:11:37 +00:00
}
else
2012-04-07 09:11:37 +00:00
{
color=color1[color1.length-1];
2012-04-07 09:11:37 +00:00
}
var poly = new google.maps.Polyline({
path: points.slice(lastCut),
strokeColor: color,
strokeOpacity: .7,
strokeWeight: 4,
map: map
});
polylinenes.push(poly);
currentPoints = [];
polyline_number= polyline_number +1;
}
2012-03-05 07:57:36 +00:00
if (startIcon != '')
2012-04-07 09:11:37 +00:00
{
var startIconImage = new google.maps.MarkerImage(startIcon);
var startMarker = new google.maps.Marker({
position: points[0],
map: map,
title: "Start",
animation: google.maps.Animation.DROP,
icon: startIconImage,
zIndex: 10
});
2012-03-05 07:57:36 +00:00
2012-04-07 09:11:37 +00:00
}
if (endIcon != '')
2012-04-07 09:11:37 +00:00
{
var endIconImage = new google.maps.MarkerImage(endIcon);
var startMarker = new google.maps.Marker({
position: points[ points.length -1 ],
map: map,
title: "Start",
animation: google.maps.Animation.DROP,
icon: endIconImage,
zIndex: 10
});
2012-08-06 09:54:48 +00:00
}
var first = getItemFromArray(mapData,0)
2012-03-05 07:57:36 +00:00
if (currentIcon == '')
2012-04-07 09:11:37 +00:00
{
currentIcon = "http://maps.google.com/mapfiles/kml/pal4/icon25.png";
2012-04-07 09:11:37 +00:00
}
var current = new google.maps.MarkerImage(currentIcon,
new google.maps.Size(32, 32),
new google.maps.Point(0,0),
new google.maps.Point(16, 16)
);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(first[0], first[1]),
title:"Start",
icon: current,
map: map,
zIndex: 10
});
for (i=0; i < polylinenes.length; i++)
{
google.maps.event.addListener(polylinenes[i],'mouseover',function(event){
if (marker)
{
marker.setPosition(event.latLng);
marker.setTitle(lng.currentPosition);
if (hchart)
{
var tooltip = hchart.tooltip;
var l1 = event.latLng.lat();
var l2 = event.latLng.lng();
var ci = getClosestIndex(mapData,l1,l2);
var items = [];
var seriesLen = hchart.series.length;
for(var i=0; i<seriesLen;i++)
{
items.push(hchart.series[i].data[ci]);
}
if (items.length > 0)
tooltip.refresh(items);
}
}
});
}
2012-03-05 07:57:36 +00:00
}
2012-04-07 09:11:37 +00:00
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
// FIX post tabs
var $_tab = $(el).closest(".wordpress-post-tabs").eq(0);
if ($_tab)
{
2014-07-14 07:48:30 +00:00
$("div > ul > li > a", $_tab).click(function(e){
setTimeout(function(e){
google.maps.event.trigger(map, 'resize');
2014-07-14 07:48:30 +00:00
//map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
tabResized = true;
},10);
});
}
var controlUIcenter = null;
var idFirstCenterChanged = true;
google.maps.event.addListener(map, 'center_changed', function() {
if (idFirstCenterChanged == true)
{
idFirstCenterChanged = false;
return;
}
if (controlUIcenter == null)
{
// Set CSS for the control border
controlUIcenter = document.createElement('img');
controlUIcenter.src = pluginUrl + "/wp-gpx-maps/img/backToCenter.png";
controlUIcenter.style.cursor = 'pointer';
controlUIcenter.title = lng.backToCenter;
controlDiv.appendChild(controlUIcenter);
// Setup the click event listeners
google.maps.event.addDomListener(controlUIcenter, 'click', function(event) {
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
controlDiv.removeChild(controlUIcenter);
controlUIcenter = null;
return false;
});
}
});
var graphh = jQuery('#hchart_' + params.targetId).css("height");
if (graphDist != '' && (graphEle != '' || graphSpeed != '' || graphHr != '' || graphAtemp != '' || graphCad != '') && graphh != "0px")
2012-02-15 16:04:18 +00:00
{
var valLen = graphDist.length;
var l_y_arr = [];
2012-04-07 09:11:37 +00:00
if (unit=="1")
2012-12-21 13:46:55 +00:00
{
l_x = { suf : "mi", dec : 1 };
l_y = { suf : "ft", dec : 0 };
}
else if (unit=="2")
2012-06-25 10:22:56 +00:00
{
l_x = { suf : "km", dec : 1 };
l_y = { suf : "m", dec : 0 };
}
else if (unit=="3")
2012-02-15 16:04:18 +00:00
{
l_x = { suf : "NM", dec : 1 };
l_y = { suf : "m", dec : 0 };
}
else if (unit=="4")
2012-02-15 16:04:18 +00:00
{
l_x = { suf : "mi", dec : 1 };
l_y = { suf : "m", dec : 0 };
}
else if (unit=="5")
{
l_x = { suf : "NM", dec : 1 };
l_y = { suf : "ft", dec : 0 };
}
2012-02-15 16:04:18 +00:00
else
{
l_x = { suf : "m", dec : 0 };
l_y = { suf : "m", dec : 0 };
2012-02-15 16:04:18 +00:00
}
2012-03-05 07:57:36 +00:00
var nn = 1111.1;
var _nn = nn.toLocaleString();
var _nnLen = _nn.length;
var decPoint = _nn.substring(_nnLen - 2, _nnLen - 1);
var thousandsSep = _nn.substring(1, 2);
if (decPoint == "1")
decPoint = ".";
if (thousandsSep == "1")
thousandsSep = "";
// define the options
var hoptions = {
chart: {
renderTo: 'hchart_' + params.targetId,
type: 'area',
events: {
selection: function(event) {
if (event.xAxis) {
el_report.innerHTML = 'Zoom: '+ (event.xAxis[0].min).toFixed(l_x.dec) + ' ' + l_x.suf + ' -> '+ (event.xAxis[0].max).toFixed(decPoint) + ' ' + l_x.suf + '<br />';
var seriesLength = event.currentTarget.series.length;
for (var i = 0; i < seriesLength; i++) {
var dataX = {value: 0, count: 0};
var serie = event.currentTarget.series[i];
var points = serie.points;
var min = event.xAxis[0].min, max = event.xAxis[0].max;
for (var j = 0; j < points.length; j++) {
if (points[j].x >= min && points[j].x <= max) {
dataX.value += points[j].y;
dataX.count +=1;
}
}
var name = serie.name;
if (name == lng.altitude) {
el_report.innerHTML += name + ' avg: ' + (dataX.value / dataX.count).toFixed(l_y.dec) + " " + l_y.suf + "<br />";
} else if (name == lng.speed) {
el_report.innerHTML += name + ' avg: ' + (dataX.value / dataX.count).toFixed(l_s.dec) + " " + l_s.suf + "<br />";
} else if (name == lng.grade) {
el_report.innerHTML += name + ' avg: ' + (dataX.value / dataX.count).toFixed(l_grade.dec) + " " + l_grade.suf + "<br />";
} else if (name == lng.cadence) {
el_report.innerHTML += name + ' avg: ' + (dataX.value / dataX.count).toFixed(l_cad.dec) + " " + l_cad.suf + "<br />";
} else if (name == lng.heartRate) {
el_report.innerHTML += name + ' avg: ' + (dataX.value / dataX.count).toFixed(l_hr.dec) + " " + l_hr.suf + "<br />";
} else
{
el_report.innerHTML += serie.name + ' avg: ' + dataX.value / dataX.count + "<br />";
}
2012-04-07 09:11:37 +00:00
}
el_report.innerHTML += "<br />"
} else {
el_report.innerHTML = '';
}
}
},
zoomType: 'x'
},
title: {
text: null
},
xAxis: {
type: 'integer',
//gridLineWidth: 1,
//tickInterval: 1000,
labels: {
formatter: function() {
return Highcharts.numberFormat(this.value, l_x.dec,decPoint,thousandsSep) + l_x.suf;
}
}
},
yAxis: [],
legend: {
align: 'center',
verticalAlign: 'top',
y: -5,
floating: true,
borderWidth: 0
},
tooltip: {
shared: true,
crosshairs: true,
2012-04-07 09:11:37 +00:00
formatter: function() {
if (marker)
{
var hchart_xserie = hchart.xAxis[0].series[0].data;
for(var i=0; i<hchart_xserie.length;i++){
var item = hchart_xserie[i];
if(item.x == this.x)
{
var point = getItemFromArray(mapData,i)
if (point)
{
marker.setPosition(new google.maps.LatLng(point[0],point[1]));
}
marker.setTitle(lng.currentPosition);
i+=10000000;
}
}
}
var tooltip = "<b>" + Highcharts.numberFormat(this.x, l_x.dec,decPoint,thousandsSep) + l_x.suf + "</b><br />";
for (i=0; i < this.points.length; i++)
{
tooltip += this.points[i].series.name + ": " + Highcharts.numberFormat(this.points[i].y, l_y_arr[i].dec,decPoint,thousandsSep) + l_y_arr[i].suf + "<br />";
}
return tooltip;
2012-04-07 09:11:37 +00:00
}
},
plotOptions: {
area: {
fillOpacity: 0.1,
connectNulls : true,
marker: {
enabled: false,
symbol: 'circle',
radius: 2,
states: {
hover: {
enabled: true
}
}
}
}
},
credits: {
enabled: false
},
series: []
};
if (graphEle != '')
2012-04-07 09:11:37 +00:00
{
var eleData = [];
var myelemin = 99999;
var myelemax = -99999;
for (i=0; i<valLen; i++)
{
if (graphDist[i] != null)
{
var _graphEle = graphEle[i];
eleData.push([graphDist[i],_graphEle]);
if (_graphEle > myelemax)
myelemax = _graphEle;
if (_graphEle < myelemin)
myelemin = _graphEle;
}
}
var yaxe = {
title: { text: null },
labels: {
align: 'left',
formatter: function() {
return Highcharts.numberFormat(this.value, l_y.dec,decPoint,thousandsSep) + l_y.suf;
}
}
}
if ( chartFrom1 != '' )
{
yaxe.min = chartFrom1;
yaxe.startOnTick = false;
}
else {
yaxe.min = myelemin;
}
if ( chartTo1 != '' )
{
yaxe.max = chartTo1;
yaxe.endOnTick = false;
}
else {
yaxe.max = myelemax;
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.altitude,
lineWidth: 1,
marker: { radius: 0 },
data : eleData,
color: color2,
yAxis: hoptions.series.length
});
l_y_arr.push(l_y);
2012-03-05 07:57:36 +00:00
}
if (graphSpeed != '')
2012-03-05 07:57:36 +00:00
{
if (unitspeed == '5') // knots
{
l_s = { suf : "knots", dec : 2 };
}
else if (unitspeed == '4') // min/miles
{
l_s = { suf : "min/mi", dec : 2 };
}
else if (unitspeed == '3') // min/km
{
l_s = { suf : "min/km", dec : 2 };
}
else if (unitspeed == '2') // miles/h
{
l_s = { suf : "mi/h", dec : 0 };
}
else if (unitspeed == '1') // km/h
{
l_s = { suf : "km/h", dec : 0 };
}
else
{
l_s = { suf : "m/s", dec : 0 };
}
var speedData = [];
2012-04-07 09:11:37 +00:00
for (i=0; i<valLen; i++)
{
if (graphDist[i] != null)
speedData.push([graphDist[i],graphSpeed[i]]);
}
var yaxe = {
title: { text: null },
labels: {
//align: 'right',
formatter: function() {
return Highcharts.numberFormat(this.value, l_s.dec,decPoint,thousandsSep) + l_s.suf;
}
},
opposite: true
}
if ( chartFrom2 != '' )
{
yaxe.min = chartFrom2;
yaxe.startOnTick = false;
}
if ( chartTo2 != '' )
{
yaxe.max = chartTo2;
yaxe.endOnTick = false;
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.speed,
lineWidth: 1,
marker: { radius: 0 },
data : speedData,
color: color3,
yAxis: hoptions.series.length
});
l_y_arr.push(l_s);
}
2012-04-07 09:11:37 +00:00
if (graphHr != '')
2011-12-14 10:35:25 +00:00
{
var hrData = [];
for (i=0; i<valLen; i++)
2012-07-02 12:51:45 +00:00
{
if (graphDist[i] != null)
{
var c = graphHr[i];
if (c==0)
c = null;
hrData.push([graphDist[i],c]);
}
2012-07-02 12:51:45 +00:00
}
2012-03-17 11:46:00 +00:00
var yaxe = {
title: { text: null },
labels: {
//align: 'right',
formatter: function() {
return Highcharts.numberFormat(this.value, l_hr.dec,decPoint,thousandsSep) + l_hr.suf;
}
},
opposite: true
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.heartRate,
lineWidth: 1,
marker: { radius: 0 },
data : hrData,
color: color4,
yAxis: hoptions.series.length
});
l_y_arr.push(l_hr);
}
2012-04-07 09:11:37 +00:00
2012-04-12 14:49:22 +00:00
if (graphAtemp != '')
2012-04-12 14:49:22 +00:00
{
var atempData = [];
for (i=0; i<valLen; i++)
2012-07-02 12:51:45 +00:00
{
if (graphDist[i] != null)
{
var c = graphAtemp[i];
if (c==0)
c = null;
atempData.push([graphDist[i],c]);
}
2012-07-02 12:51:45 +00:00
}
2012-03-17 11:46:00 +00:00
var yaxe = {
title: { text: null },
labels: {
//align: 'right',
formatter: function() {
return Highcharts.numberFormat(this.value, 1, decPoint,thousandsSep) + " °C";
}
},
opposite: true
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.atemp,
lineWidth: 1,
marker: { radius: 0 },
data : atempData,
color: color7,
yAxis: hoptions.series.length
});
l_y_arr.push({ suf : "°C", dec : 1 });
2012-04-12 14:49:22 +00:00
}
if (graphCad != '')
{
var cadData = [];
for (i=0; i<valLen; i++)
{
if (graphDist[i] != null)
{
var c = graphCad[i];
if (c==0)
c = null;
cadData.push([graphDist[i],c]);
}
}
var yaxe = {
title: { text: null },
labels: {
//align: 'right',
formatter: function() {
return Highcharts.numberFormat(this.value, l_cad.dec,decPoint,thousandsSep) + l_cad.suf;
}
},
opposite: true
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.cadence,
lineWidth: 1,
marker: { radius: 0 },
data : cadData,
color: color5,
yAxis: hoptions.series.length
});
l_y_arr.push(l_cad);
}
if (graphGrade != '')
{
var cadData = [];
for (i=0; i<valLen; i++)
{
if (graphDist[i] != null)
{
var c = graphGrade[i];
if (c==0)
c = null;
cadData.push([graphDist[i],c]);
}
}
var yaxe = {
title: { text: null },
labels: {
//align: 'right',
formatter: function() {
return Highcharts.numberFormat(this.value, l_grade.dec,decPoint,thousandsSep) + l_grade.suf;
}
},
opposite: true
}
hoptions.yAxis.push(yaxe);
hoptions.series.push({
name: lng.grade,
lineWidth: 1,
marker: { radius: 0 },
data : cadData,
color: color6,
yAxis: hoptions.series.length
});
l_y_arr.push(l_grade);
}
var hchart = new Highcharts.Chart(hoptions);
}
else {
jQuery("#hchart_" + params.targetId).css("display","none");
}
2012-04-07 09:11:37 +00:00
return this;
};
2012-04-07 09:11:37 +00:00
function addWayPoint(map, image, shadow, lat, lon, title, descr)
{
var p = new google.maps.LatLng(lat, lon);
var m = new google.maps.Marker({
position: p,
map: map,
title: title,
animation: google.maps.Animation.DROP,
shadow: shadow,
icon: image,
zIndex: 5
});
google.maps.event.addListener(m, 'mouseover', function() {
if (infowindow)
{
infowindow.close();
}
var cnt = '';
if (title=='')
{
cnt = "<div style='text-align:center;'>" + unescape(descr) + "</div>";
}
else
{
cnt = "<div style='font-size:0.8em; text-align:center;'><b>" + title + "</b><br />" + unescape(descr) + "</div>";
}
infowindow = new google.maps.InfoWindow({ content: cnt});
infowindow.open(map,m);
});
google.maps.event.addListener(m, "mouseout", function () {
if (infowindow)
{
infowindow.close();
}
});
}
2011-12-24 14:37:05 +00:00
function getItemFromArray(arr,index)
{
try
2012-03-17 11:46:00 +00:00
{
return arr[index];
2012-03-17 11:46:00 +00:00
}
catch(e)
2012-03-17 11:46:00 +00:00
{
return [0,0];
2012-03-17 11:46:00 +00:00
}
2011-12-14 10:35:25 +00:00
}
2011-12-29 09:54:00 +00:00
2012-09-12 13:59:14 +00:00
function getClosestIndex(points,lat,lon)
2011-12-29 09:54:00 +00:00
{
var dd=10000;
var ii=0;
for (i=0; i < points.length; i++)
2011-12-29 09:54:00 +00:00
{
if (points[i]==null)
continue;
var d = dist(points[i][0], points[i][1], lat, lon);
if ( d < dd )
{
ii = i;
dd = d;
}
2011-12-29 09:54:00 +00:00
}
return ii;
2011-12-29 09:54:00 +00:00
}
function getClosestImage(lat,lon,targetId)
{
var dd=10000;
var img;
var divImages = document.getElementById("ngimages_"+targetId);
var img_spans = divImages.getElementsByTagName("span");
for (var i = 0; i < img_spans.length; i++) {
var imageLat = img_spans[i].getAttribute("lat");
var imageLon = img_spans[i].getAttribute("lon");
imageLat = imageLat.replace(",", ".");
imageLon = imageLon.replace(",", ".");
var d = dist(imageLat, imageLon, lat, lon);
if ( d < dd )
{
img = img_spans[i];
dd = d;
}
}
return img;
2012-03-17 11:46:00 +00:00
}
function isNumeric(input){
var RE = /^-{0,1}\d*\.{0,1}\d+$/;
return (RE.test(input));
}
2012-03-05 07:57:36 +00:00
function dist(lat1,lon1,lat2,lon2)
{
// mathematically not correct but fast
var dLat = (lat2-lat1);
var dLon = (lon2-lon1);
return Math.sqrt(dLat * dLat + dLon * dLon);
}
}( jQuery ));