diff --git a/js/api_gmaps.js b/js/api_gmaps.js index a8086d0..b163a1c 100755 --- a/js/api_gmaps.js +++ b/js/api_gmaps.js @@ -43,7 +43,7 @@ function init() { } function displayTrack(xml, update) { - altitudes.length = 0; + altitudes = {}; var totalMeters = 0; var totalSeconds = 0; // init polyline @@ -54,7 +54,7 @@ function displayTrack(xml, update) { var positions = xml.getElementsByTagName('position'); var posLen = positions.length; for (var i = 0; i < posLen; i++) { - var p = parsePosition(positions[i]); + var p = parsePosition(positions[i], i); totalMeters += p.distance; totalSeconds += p.seconds; p['totalMeters'] = totalMeters; @@ -131,7 +131,14 @@ function setMarker(p, i, posLen) { popup.setContent(content); popup.open(map, marker); if (document.getElementById('bottom').style.display == 'block') { - chart.setSelection([{ row: i, column: null }]); + var index = 0; + for (var key in altitudes) { + if (altitudes.hasOwnProperty(key) && key == i) { + chart.setSelection([{ row: index, column: null }]); + break; + } + index++; + } } } })(marker, content)); @@ -139,12 +146,12 @@ function setMarker(p, i, posLen) { popups.push(popup); } -function addChartEvent(chart) { +function addChartEvent(chart, data) { google.visualization.events.addListener(chart, 'select', function () { if (popup) { popup.close(); clearTimeout(altTimeout); } var selection = chart.getSelection()[0]; if (selection) { - var id = selection.row; + var id = data.getValue(selection.row, 0) - 1; var icon = markers[id].getIcon(); markers[id].setIcon('//maps.google.com/mapfiles/marker_orange.png'); altTimeout = setTimeout(function () { markers[id].setIcon(icon); }, 2000); diff --git a/js/api_openlayers.js b/js/api_openlayers.js index 35f1d99..4afe8b1 100755 --- a/js/api_openlayers.js +++ b/js/api_openlayers.js @@ -85,7 +85,7 @@ function init() { layerMarkers = new OpenLayers.Layer.Markers('Markers'); } function displayTrack(xml, update) { - altitudes.length = 0; + altitudes = {}; var totalMeters = 0; var totalSeconds = 0; var points = new Array(); @@ -93,7 +93,7 @@ function displayTrack(xml, update) { var positions = xml.getElementsByTagName('position'); var posLen = positions.length; for (var i = 0; i < posLen; i++) { - var p = parsePosition(positions[i]); + var p = parsePosition(positions[i], i); totalMeters += p.distance; totalSeconds += p.seconds; p['totalMeters'] = totalMeters; @@ -169,17 +169,24 @@ function setMarker(p, i, posLen) { var popup = new OpenLayers.Popup.FramedCloud("popup_" + (i + 1), lonLat, null, content, icon, true); map.addPopup(popup); if (document.getElementById('bottom').style.display == 'block') { - chart.setSelection([{ row: i, column: null }]); + var index = 0; + for (var key in altitudes) { + if (altitudes.hasOwnProperty(key) && key == i) { + chart.setSelection([{ row: index, column: null }]); + break; + } + index++; + } } } })()); } -function addChartEvent(chart) { +function addChartEvent(chart, data) { google.visualization.events.addListener(chart, 'select', function () { var selection = chart.getSelection()[0]; if (selection) { - var id = selection.row; + var id = data.getValue(selection.row, 0) - 1; var marker = layerMarkers.markers[id]; var url = marker.icon.url; marker.setUrl('//www.openstreetmap.org/openlayers/img/marker-gold.png'); diff --git a/js/main.js b/js/main.js index 54bee9e..e678b07 100755 --- a/js/main.js +++ b/js/main.js @@ -35,7 +35,7 @@ if (units == 'imperial') { var latest = 0; var live = 0; var chart; -var altitudes = new Array(); +var altitudes = {}; var altTimeout; var gm_error = false; @@ -43,10 +43,12 @@ function displayChart() { if (chart) { google.visualization.events.removeAllListeners(chart); } var data = new google.visualization.DataTable(); data.addColumn('number', 'id'); - data.addColumn('number', 'altitude'); - var altLen = altitudes.length; - for (var i = 0; i < altLen; i++) { - data.addRow([(i + 1), Math.round((altitudes[i] * factor_m))]); + data.addColumn('number', lang['altitude']); + + for (var id in altitudes) { + if (altitudes.hasOwnProperty(id)) { + data.addRow([parseInt(id) + 1, Math.round((altitudes[id] * factor_m))]); + } } var options = { @@ -58,7 +60,7 @@ function displayChart() { chart = new google.visualization.LineChart(document.getElementById('chart')); chart.draw(data, options); - addChartEvent(chart); + addChartEvent(chart, data); } function toggleChart(i) { @@ -80,7 +82,7 @@ function toggleChart(i) { function toggleChartLink() { var link = document.getElementById('altitudes'); - if (altitudes.length > 1) { + if (Object.keys(altitudes).length > 1) { link.style.visibility = 'visible'; } else { link.style.visibility = 'hidden'; @@ -145,7 +147,7 @@ function loadTrack(userid, trackid, update) { setLoader(title); } -function parsePosition(p) { +function parsePosition(p, id) { // read data var latitude = getNode(p, 'latitude'); var longitude = getNode(p, 'longitude'); @@ -153,7 +155,7 @@ function parsePosition(p) { if (altitude != null) { altitude = parseInt(altitude); // save altitudes for chart - altitudes.push(altitude); + altitudes[id] = altitude; } var speed = getNode(p, 'speed'); // may be null if (speed != null) { speed = parseInt(speed); }