diff options
Diffstat (limited to 'api_openlayers.js')
| -rwxr-xr-x | api_openlayers.js | 169 |
1 files changed, 169 insertions, 0 deletions
diff --git a/api_openlayers.js b/api_openlayers.js new file mode 100755 index 0000000..434c8e6 --- /dev/null +++ b/api_openlayers.js @@ -0,0 +1,169 @@ +/* phpTrackme + * + * Copyright(C) 2013 Bartek Fabiszewski (www.fabiszewski.net) + * + * This is free software; you can redistribute it and/or modify it under + * the terms of the GNU Library General Public License as published by + * the Free Software Foundation; either version 2 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, but + * WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * General Public License for more details. + * + * You should have received a copy of the GNU Library General Public + * License along with this program; if not, write to the Free Software + * Foundation, Inc., 675 Mass Ave, Cambridge, MA 02139, USA. + */ + +// openlayers +var map; +var layerTrack; +var layerMarkers; +var lineStyle = {strokeColor: '#FF0000', strokeOpacity: 1, strokeWidth: 2}; +var wgs84; +var mercator; +var loadedAPI = 'openlayers'; +function init() { + wgs84 = new OpenLayers.Projection('EPSG:4326'); // from WGS 1984 + mercator = new OpenLayers.Projection('EPSG:900913'); // to Mercator + var options = { controls: [ + new OpenLayers.Control.ArgParser(), // default + new OpenLayers.Control.Attribution(), // default + new OpenLayers.Control.LayerSwitcher({'ascending':false}), + new OpenLayers.Control.Navigation(), // default + new OpenLayers.Control.PanZoomBar(),// do we need it? + new OpenLayers.Control.ScaleLine() + ] + }; + map = new OpenLayers.Map('map-canvas', options); + map.addLayer(new OpenLayers.Layer.OSM()); + var position = new OpenLayers.LonLat(21.01,52.23).transform(wgs84, mercator); + var zoom = 8; + map.setCenter(position, zoom); +} +function displayTrack(xml,update) { + altitudes.length = 0; + var totalMeters = 0; + var totalSeconds = 0; + // init layer + layerTrack = new OpenLayers.Layer.Vector( 'Track' ); + layerMarkers = new OpenLayers.Layer.Markers( 'Markers' ); + var points = new Array(); + var latlngbounds = new OpenLayers.Bounds(); + var positions = xml.getElementsByTagName('position'); + var posLen = positions.length; + for (var i=0; i<posLen; i++) { + var p = parsePosition(positions[i]); + totalMeters += p.distance; + totalSeconds += p.seconds; + p['totalMeters'] = totalMeters; + p['totalSeconds'] = totalSeconds; + // set marker + setMarker(p,i,posLen); + // update polyline + var point = new OpenLayers.Geometry.Point(p.longitude, p.latitude).transform(wgs84,mercator); + latlngbounds.extend(point); + points.push(point); + // save altitudes for chart + altitudes[i] = p.altitude; + } + var lineString = new OpenLayers.Geometry.LineString(points); + var lineFeature = new OpenLayers.Feature.Vector(lineString, null, lineStyle); + layerTrack.addFeatures([lineFeature]); + map.addLayer(layerTrack); + map.addLayer(layerMarkers); + if (update) { + map.zoomToExtent(latlngbounds); + if (i==1) { + // only one point, zoom out + map.zoomOut(); + } + } + latestTime = p.dateoccured; + //polies.push(poly); + + updateSummary(p.dateoccured,totalMeters,totalSeconds); + if (p.tid!=trackid) { + trackid=p.tid; + setTrack(trackid); + } + if (document.getElementById('bottom').style.display=='block') { + // update altitudes chart + chart.clearChart(); + displayChart(); + } +} + +function clearMap(){ + if (layerTrack){ + layerTrack.removeAllFeatures(); + } + if (layerMarkers){ + layerMarkers.clearMarkers(); + } +} + +function setMarker(p,i,posLen) { + // marker + var lonLat = new OpenLayers.LonLat(p.longitude,p.latitude).transform(wgs84,mercator); + var size = new OpenLayers.Size(21, 25); + var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); + if (latest==1) { var icon = new OpenLayers.Icon('http://www.openstreetmap.org/openlayers/img/marker.png',size,offset); } + else if (i==0) { var icon = new OpenLayers.Icon('http://www.openstreetmap.org/openlayers/img/marker-green.png',size,offset); } + else if (i==posLen-1) { var icon = new OpenLayers.Icon('http://www.openstreetmap.org/openlayers/img/marker.png',size,offset); } + else { + size = new OpenLayers.Size(12, 20); + offset = new OpenLayers.Pixel(-(size.w/2), -size.h); + var icon = new OpenLayers.Icon('http://labs.google.com/ridefinder/images/mm_20_gray.png',size,offset); + } + var marker = new OpenLayers.Marker(lonLat,icon); + layerMarkers.addMarker(marker); + + + // popup + var content = '<div id="popup">'+ + '<div id="pheader">'+lang_user+': '+p.username.toUpperCase()+'<br />'+lang_track+': '+p.trackname.toUpperCase()+ + '</div>'+ + '<div id="pbody">'+ + '<div id="pleft"><b>'+lang_time+':</b> '+p.dateoccured+'<br />'+ + ((p.speed != null)?'<b>'+lang_speed+':</b> '+(p.speed.toKmH()*factor_kmh)+' '+unit_kmh+'<br />':'')+ + ((p.altitude != null)?'<b>'+lang_altitude+':</b> '+(p.altitude*factor_m).toFixed()+' '+unit_m+'<br />':'')+'</div>'+ + ((latest==0)? + ('<div id="pright"><b>'+lang_ttime+':</b> '+p.totalSeconds.toHMS()+'<br />'+ + '<b>'+lang_aspeed+':</b> '+((p.totalSeconds>0)?((p.totalMeters/p.totalSeconds).toKmH()*factor_kmh).toFixed():0)+' '+unit_kmh+'<br />'+ + '<b>'+lang_tdistance+':</b> '+(p.totalMeters.toKm()*factor_km).toFixed(2)+' '+unit_km+'<br />'+'</div>'):'')+ + '<div id="pfooter">'+lang_point+' '+(i+1)+' '+lang_of+' '+(posLen)+'</div>'+ + '</div></div>'; + marker.events.register("mousedown", marker, (function() { + return function() { + // remove popups + if (map.popups.length>0) { + for (var i = map.popups.length-1; i>=0; i-- ) { + map.removePopup(map.popups[i]) + }; + } + // show popup + var popup = new OpenLayers.Popup.FramedCloud("id "+(i+1),lonLat,null,content,icon,true); + map.addPopup(popup); + if (document.getElementById('bottom').style.display=='block') { + chart.setSelection([{row:i,column:null}]); + } + } + })()); + +} + +function addChartEvent(chart) { + google.visualization.events.addListener(chart, 'select', function() { + var selection = chart.getSelection()[0]; + if (selection) { + var id = selection.row; + var marker = layerMarkers.markers[id]; + var url = marker.icon.url; + marker.setUrl('http://www.openstreetmap.org/openlayers/img/marker-gold.png'); + altTimeout = setTimeout(function() { marker.setUrl(url); },2000); + } + }); +} |