1/* 2Plugin Name: WP-GPX-Maps 3Plugin URI: http://www.devfarm.it/ 4Description: Draws a gpx track with altitude graph 5Version: 1.6.02 6Author: Bastianon Massimo 7Author URI: http://www.devfarm.it/ 8*/ 9 10var WPGPXMAPS = { 11 12 Utils: { 13 14 /* In case of multiple polylines this function divide the points of each polyline. */ 15 DividePolylinesPoints: function( mapData ) { 16 17 var lastCut = 0; 18 var result = []; 19 var _len = mapData.length; 20 21 for ( i = 0; i < _len; i++ ) { 22 if ( null == mapData[i]) { 23 result.push( mapData.slice( lastCut == 0 ? 0 : lastCut + 1, i ) ); 24 lastCut = i; 25 } 26 } 27 if ( ( _len - 1 ) != lastCut ) { 28 result.push( mapData.slice( lastCut ) ); 29 } 30 return result; 31 32 }, 33 34 GetItemFromArray: function( arr, index ) { 35 try { 36 return arr[index]; 37 } catch ( e ) { 38 return [ 0, 0 ]; 39 } 40 } 41 42 }, 43 44 MapEngines: { 45 46 /* NOT WORKING AND TESTED! old code copy&paste */ 47 GoogleMaps: function() { 48 49 var ngImageMarkers = []; 50 51 this.map = null, 52 this.EventSelectChart = null, 53 this.Polylines = [], 54 this.init = function( targetElement, mapType, scrollWheelZoom, ThunderforestApiKey ) { 55 var mapTypeIds = []; 56 for ( var type in google.maps.MapTypeId ) { 57 mapTypeIds.push( google.maps.MapTypeId[type]); 58 } 59 60 mapTypeIds.push( 'OSM1' ); 61 mapTypeIds.push( 'OSM2' ); 62 mapTypeIds.push( 'OSM3' ); 63 mapTypeIds.push( 'OSM4' ); 64 mapTypeIds.push( 'OSM5' ); 65 //mapTypeIds.push( 'OSM6' ); 66 67 switch ( mapType ) { 68 case 'TERRAIN': { mapType = google.maps.MapTypeId.TERRAIN; break;} 69 case 'SATELLITE': { mapType = google.maps.MapTypeId.SATELLITE; break;} 70 case 'ROADMAP': { mapType = google.maps.MapTypeId.ROADMAP; break;} 71 case 'OSM1': { mapType = 'OSM1'; break;} 72 case 'OSM2': { mapType = 'OSM2'; break;} 73 case 'OSM3': { mapType = 'OSM3'; break;} 74 case 'OSM4': { mapType = 'OSM4'; break;} 75 case 'OSM5': { mapType = 'OSM5'; break;} 76 //case 'OSM6': { mapType = 'OSM6'; break;} 77 default: { mapType = google.maps.MapTypeId.HYBRID; break;} 78 } 79 80 if ( 'TERRAIN' == mapType || 'SATELLITE' == mapType || 'ROADMAP' == mapType ) { 81 82 // Google maps. 83 84 } else { 85 86 // Show OpenStreetMaps credits. 87 88 $( el_osm_credits ).show(); 89 } 90 91 this.map = new google.maps.Map( el_map, { 92 mapTypeId: mapType, 93 scrollwheel: ( 'true' == zoomOnScrollWheel ), 94 mapTypeControlOptions: { 95 style: google.maps.MapTypeControlStyle.DROPDOWN_MENU, 96 mapTypeIds: mapTypeIds 97 } 98 }); 99 100 /* Map type: Open Street Mao */ 101 this.map.mapTypes.set( 'OSM1', new google.maps.ImageMapType({ 102 getTileUrl: function( coord, zoom ) { 103 return 'https://tile.openstreetmap.org/' + zoom + '/' + coord.x + '/' + coord.y + '.png'; 104 }, 105 tileSize: new google.maps.Size( 256, 256 ), 106 name: 'OSM', 107 alt: 'Open Street Map', 108 maxZoom: 18 109 }) ); 110 111 /* Map type: Thunderforest - Open Cycle Map with API key or Open Cycle Map - Cycle */ 112 this.map.mapTypes.set( 'OSM2', new google.maps.ImageMapType({ 113 getTileUrl: function( coord, zoom ) { 114 if ( hasThunderforestApiKey ) { 115 return 'https://a.tile.thunderforest.com/cycle/' + zoom + '/' + coord.x + '/' + coord.y + '.png?apikey=' + ThunderforestApiKey; 116 } else { 117 return 'http://a.tile.opencyclemap.org/cycle/' + zoom + '/' + coord.x + '/' + coord.y + '.png'; 118 } 119 }, 120 tileSize: new google.maps.Size( 256, 256 ), 121 name: 'TF-OCM', 122 alt: 'Thunderforest - Open Cycle Map', 123 maxZoom: 18 124 }) ); 125 126 /* Map type: Thunderforest - Transport with API key */ 127 this.map.mapTypes.set( 'OSM3', new google.maps.ImageMapType({ 128 getTileUrl: function( coord, zoom ) { 129 return 'https://a.tile.thunderforest.com/outdoors/' + zoom + '/' + coord.x + '/' + coord.y + '.png?apikey=' + ThunderforestApiKey; 130 }, 131 tileSize: new google.maps.Size( 256, 256 ), 132 name: 'TF-Outd', 133 alt: 'Thunderforest - Outdoors', 134 maxZoom: 18 135 }) ); 136 137 /* Map type: Thunderforest - Transport with API key */ 138 this.map.mapTypes.set( 'OSM4', new google.maps.ImageMapType({ 139 getTileUrl: function( coord, zoom ) { 140 return 'https://a.tile.thunderforest.com/transport/' + zoom + '/' + coord.x + '/' + coord.y + '.png?apikey=' + ThunderforestApiKey; 141 }, 142 tileSize: new google.maps.Size( 256, 256 ), 143 name: 'TF-Tran', 144 alt: 'Thunderforest - Transport', 145 maxZoom: 18 146 }) ); 147 148 /* Map type: Thunderforest - Landscape with API key */ 149 this.map.mapTypes.set( 'OSM5', new google.maps.ImageMapType({ 150 getTileUrl: function( coord, zoom ) { 151 return 'https://a.tile.thunderforest.com/landscape/' + zoom + '/' + coord.x + '/' + coord.y + '.png?apikey=' + ThunderforestApiKey; 152 }, 153 tileSize: new google.maps.Size( 256, 256 ), 154 name: 'TF-Land', 155 alt: 'Thunderforest - Landscape', 156 maxZoom: 18 157 }) ); 158 159 /* Map type: MapToolKit - Terrain */ 160 //this.map.mapTypes.set( 'OSM6', new google.maps.ImageMapType({ 161 // getTileUrl: function( coord, zoom ) { 162 // return 'https://tile2.maptoolkit.net/terrain/' + zoom + '/' + coord.x + '/' + coord.y + '.png'; 163 // }, 164 // tileSize: new google.maps.Size( 256, 256 ), 165 // name: 'MTK-Terr', 166 // alt: 'MapToolKit - Terrain', 167 // maxZoom: 18 168 //}) ); 169 }, 170
171 this.AppPolylines = function( mapData, color1, currentIcon, startIcon, endIcon ) { 172 173 var points = []; 174 var lastCut = 0; 175 var polylinenes = []; 176 var polyline_number = 0; 177 var color = 0; 178 for ( i = 0; i < mapData.length; i++ ) { 179 if ( null == mapData[i]) { 180 var poly = new google.maps.Polyline({ 181 path: points.slice( lastCut, i ), 182 strokeColor: color, 183 strokeOpacity: .7, 184 strokeWeight: 4, 185 map: this.map 186 }); 187 polylinenes.push( poly ); 188 lastCut = i; 189 polyline_number = polyline_number + 1; 190 191 // var p = new google.maps.LatLng(mapData[i-1][0], mapData[i-1][1]); 192 // points.push(p); 193 // bounds.extend(p); 194 195 } else { 196 var p = new google.maps.LatLng( mapData[i][0], mapData[i][1]); 197 points.push( p ); 198 bounds.extend( p ); 199 } 200 } 201 202 if ( points.length != lastCut ) { 203 if ( polyline_number < color1.length ) { 204 color = color1[polyline_number]; 205 } else { 206 color = color1[color1.length - 1]; 207 } 208 var poly = new google.maps.Polyline({ 209 path: points.slice( lastCut ), 210 strokeColor: color, 211 strokeOpacity: .7, 212 strokeWeight: 4, 213 map: this.map 214 }); 215 polylinenes.push( poly ); 216 currentPoints = []; 217 polyline_number = polyline_number + 1; 218 } 219 220 if ( startIcon != '' ) { 221 var startIconImage = new google.maps.MarkerImage( startIcon ); 222 var startMarker = new google.maps.Marker({ 223 position: points[0], 224 map: this.map, 225 title: 'Start', 226 animation: google.maps.Animation.DROP, 227 icon: startIconImage, 228 zIndex: 10 229 }); 230 231 } 232 233 if ( endIcon != '' ) { 234 var endIconImage = new google.maps.MarkerImage( endIcon ); 235 var startMarker = new google.maps.Marker({ 236 position: points[ points.length -1 ], 237 map: this.map, 238 title: 'End', 239 animation: google.maps.Animation.DROP, 240 icon: endIconImage, 241 zIndex: 10 242 }); 243 244 } 245 246 var first = WPGPXMAPS.Utils.GetItemFromArray( mapData, 0 ); 247 248 if ( currentIcon == '' ) { 249 currentIcon = 'https://maps.google.com/mapfiles/kml/pal4/icon25.png'; 250 } 251 252 var current = new google.maps.MarkerImage( currentIcon, 253 new google.maps.Size( 32, 32 ), 254 new google.maps.Point( 0, 0 ), 255 new google.maps.Point( 16, 16 ) 256 ); 257 258 var marker = new google.maps.Marker({ 259 position: new google.maps.LatLng( first[0], first[1]), 260 title: 'Current', 261 icon: current, 262 map: this.map, 263 zIndex: 10 264 }); 265 266 for ( i = 0; i < polylinenes.length; i++ ) { 267 google.maps.event.addListener( polylinenes[i], 'mouseover', function( event ) { 268 if ( marker ) { 269 marker.setPosition( event.latLng ); 270 marker.setTitle( lng.currentPosition ); 271 if ( myChart ) { 272 var l1 = event.latLng.lat(); 273 var l2 = event.latLng.lng(); 274 var ci = getClosestIndex( mapData, l1, l2 ); 275 var activeElements = []; 276 var seriesLen = myChart.data.datasets.length; 277 for ( var i = 0; i < seriesLen;i++ ) { 278 activeElements.push( myChart.chart.getDatasetMeta( i ).data[ci]); 279 } 280 if ( activeElements.length > 0 ) { 281 myChart.options.customLine.x = activeElements[0]._model.x; 282 if ( isNaN( myChart.tooltip._eventPosition ) ) { 283 myChart.tooltip._eventPosition = { 284 x: activeElements[0]._model.x, 285 y: activeElements[0]._model.y 286 }; 287 } 288 myChart.tooltip._active = activeElements; 289 myChart.tooltip.update ( true ); 290 myChart.draw(); 291 } 292 293 } 294 } 295 }); 296 } 297 }, 298 this.AddWaypoints = function( waypoints, waypointIcon ) { 299 }, 300 this.MoveMarkerToPosition = function( LatLon, updateChart ) { 301 }; 302 }, 303 304 Leaflet: function() { 305 this.Bounds = [], 306 this.lng = {}, 307 this.map = null, 308 this.EventSelectChart = null, 309 this.Polylines = [], 310 this.CurrentPositionMarker = null, 311 this.CurrentGPSPositionMarker = null, 312 this.init = function( targetElement, mapType, scrollWheelZoom, ThunderforestApiKey ) { 313 314 this.map = L.map( targetElement, 315 { 316 scrollWheelZoom: scrollWheelZoom 317 } 318 ); 319 320 /* create fullscreen control. */ 321 var fsControl = new L.Control.FullScreen(); 322 323 /* Add fullscreen control to the map. */ 324 this.map.addControl( fsControl ); 325 326 L.tileLayer( 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { 327 attribution: 'Data © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' 328 }).addTo( this.map ); 329 330 var hasThunderforestApiKey = ( ThunderforestApiKey + '' ).length > 0;
331 332 var baseMaps = {}; 333 334 var overlayMaps = { }; 335 336 var defaultMpaLayer = null; 337 338 if ( hasThunderforestApiKey ) { 339 340 /* Map type: Thunderforest - OpenCycleMap with API key */ 341 baseMaps['Thunderforest - Cycle'] = L.tileLayer( 'https://a.tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey=' + ThunderforestApiKey, { 342 maxZoom: 18, 343 attribution: 'Maps © <a href="https://www.thunderforest.com/">Thunderforest</a> contributors, ' + 344 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 345 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 346 }); 347 348 } else { 349 350 /* Map type: Open Cycle Map - Cycle */ 351 baseMaps['Open Cycle Map'] = L.tileLayer( 'http://a.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png', { 352 maxZoom: 18, 353 attribution: 'Maps © <a href="https://www.thunderforest.com/">Thunderforest</a> contributors, ' + 354 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 355 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 356 }); 357 358 } 359 360 /* Map type: Thunderforest - Outdoors with API key */ 361 baseMaps['Thunderforest - Outdoors'] = L.tileLayer( 'https://a.tile.thunderforest.com/outddors/{z}/{x}/{y}.png?apikey=' + ThunderforestApiKey, { 362 maxZoom: 18, 363 attribution: 'Maps © <a href="https://www.thunderforest.com/">Thunderforest</a> contributors, ' + 364 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 365 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 366 }); 367 368 /* Map type: Thunderforest - Transport with API key */ 369 baseMaps['Thunderforest - Transport'] = L.tileLayer( 'https://a.tile.thunderforest.com/transport/{z}/{x}/{y}.png?apikey=' + ThunderforestApiKey, { 370 maxZoom: 18, 371 attribution: 'Maps © <a href="https://www.thunderforest.com/">Thunderforest</a> contributors, ' + 372 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 373 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 374 }); 375 376 /* Map type: Thunderforest - Landscape with API key */ 377 baseMaps['Thunderforest - Landscape'] = L.tileLayer( 'https://a.tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey=' + ThunderforestApiKey, { 378 maxZoom: 18, 379 attribution: 'Maps © <a href="https://www.thunderforest.com/">Thunderforest</a> contributors, ' + 380 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 381 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 382 }); 383 384 /* Map type: Open Street Map */ 385 baseMaps['Open Street Map'] = L.tileLayer( 'https://tile.openstreetmap.org/{z}/{x}/{y}.png', { 386 maxZoom: 18, 387 attribution: 'Maps © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + 388 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 389 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 390 }); 391 392 ///* Map type: MapToolKit - Terrain */ 393 //baseMaps['MapToolKit - Terrain'] = L.tileLayer( 'https://tile2.maptoolkit.net/terrain/{z}/{x}/{y}.png', { 394 // maxZoom: 18, 395 // attribution: 'Maps © <a href="https://www.maptoolkit.net/">Maptoolkit</a> contributors, ' + 396 // '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 397 // 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 398 //}); 399 400 /* Map type: Open Street Map - Humanitarian Map Style */ 401 baseMaps['Humanitarian Map Style'] = L.tileLayer( 'https://a.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', { 402 maxZoom: 18, 403 attribution: 'Maps © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + 404 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 405 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 406 }); 407 408 /* 409 Map type: Open Ski Map 410 baseMaps['Open Ski Map'] = L.tileLayer( 'http://tiles.skimap.org/openskimap/{z}/{x}/{y}.png', { 411 maxZoom: 18, 412 attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + 413 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 414 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', 415 }); 416 */ 417 418 /* Map type: Hike & Bike */ 419 baseMaps['Hike & Bike'] = L.tileLayer( 'http://toolserver.org/tiles/hikebike/{z}/{x}/{y}.png', { 420 maxZoom: 18, 421 attribution: 'Maps © <a href="https://hikebikemap.org/">Hike & Bike Map</a> contributors, ' + 422 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 423 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 424 }); 425 426 /* Map type: Open Sea Map */ 427 baseMaps['Open Sea Map'] = L.tileLayer( 'http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png', { 428 maxZoom: 18, 429 attribution: 'Maps © <a href="https://www.openseamap.org/">OpenSeaMap</a> contributors, ' + 430 '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 431 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 432 }); 433 434 baseMaps['GSI Map (Japan)'] = L.tileLayer( 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { 435 maxZoom: 18, 436 attribution: '© <a href="https://maps.gsi.go.jp/development/ichiran.html" target="_blank">å½åå°çé¢</a>, ' + 437 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>' 438 }); 439 440 switch ( mapType ) { 441 442 /* Map type: Open Street Map */ 443 case 'OSM1': { 444 baseMaps['Open Street Map'].addTo( this.map ); 445 break; 446 } 447 448 /* Map type: Thunderforest - Open Cycle Maps with API key */ 449 case 'OSM2': { 450 baseMaps['Thunderforest - Cycle'].addTo( this.map ); 451 break; 452 } 453 454 /* Map type: Thunderforest - Outdoors with API key */ 455 case 'OSM3': { 456 baseMaps['Thunderforest - Outdoors'].addTo( this.map ); 457 break; 458 } 459 460 /* Map type: Thunderforest - Landscape with API key */ 461 case 'OSM4': { 462 baseMaps['Thunderforest - Transport'].addTo( this.map ); 463 break; 464 } 465 466 /* Map type: Thunderforest - Landscape with API key */ 467 case 'OSM5': { 468 baseMaps['Thunderforest - Landscape'].addTo( this.map ); 469 break; 470 } 471 472 ///* Map type: MapToolKit - Terrain */ 473 //case 'OSM6': { 474 // baseMaps['MapToolKit - Terrain'].addTo( this.map ); 475 // break; 476 //} 477 478 /* Map type: Open Street Map - Humanitarian Map Style*/ 479 case 'OSM7': { 480 baseMaps['Humanitarian Map Style'].addTo( this.map ); 481 break; 482 } 483 484 /* 485 Map type: Open Ski Map 486 case 'OSM8': { 487 baseMaps['Open Ski Map'].addTo( this.map ); 488 break; 489 } 490 */ 491 492 /* Map type: Hike & Bike */ 493 case 'OSM9': { 494 baseMaps['Hike & Bike'].addTo( this.map ); 495 break; 496 } 497 498 /* Map type: Open Sea Map */ 499 case 'OSM10': { 500 baseMaps['Open Sea Map'].addTo( this.map ); 501 break; 502 } 503 504 case 'OSM11': { 505 baseMaps['GSI Map (Japan)'].addTo( this.map ); 506 break; 507 } 508 509 /* Map type: Open Street Map */ 510 default: { 511 baseMaps['Open Street Map'].addTo( this.map ); 512 } 513 514 } 515 516 L.control.layers( baseMaps, overlayMaps ).addTo( this.map ); 517 518 }, 519
520 this.AppPolylines = function( mapData, color1, currentIcon, startIcon, endIcon ) { 521 522 var first = WPGPXMAPS.Utils.GetItemFromArray( mapData, 0 ); 523 524 if ( '' == currentIcon ) { 525 currentIcon = 'https://maps.google.com/mapfiles/kml/pal4/icon25.png'; 526 } 527 528 var CurrentPositionMarker = L.marker( first, { icon: L.icon ({ 529 iconUrl: currentIcon, 530 iconSize: [ 32, 32 ], // Size of the icon. 531 iconAnchor: [ 16, 16 ] // Point of the icon which will correspond to marker's location. 532 }) 533 }); 534 CurrentPositionMarker.addTo( this.map ); 535 CurrentPositionMarker.title = 'Current'; 536 537 this.CurrentPositionMarker = CurrentPositionMarker; 538 539 var pointsArray = WPGPXMAPS.Utils.DividePolylinesPoints( mapData ); 540 541 var lng = this.lng; 542 var EventSelectChart = this.EventSelectChart; 543 544 this.Bounds = mapData; 545 546 this.CenterMap(); 547 548 for ( i = 0; i < pointsArray.length; i++ ) { 549 if ( i < color1.length ) { 550 color = color1[i]; 551 } else { 552 color = color1[color1.length - 1]; 553 } 554 try { 555 var polyline = L.polyline( pointsArray[i], {color: color}).addTo( this.map ); 556 this.Polylines.push( polyline ); 557 558 var context = this; 559 560 this.Polylines[i].on( 'mousemove', function( e ) { 561 context.MoveMarkerToPosition([ e.latlng.lat, e.latlng.lng ], true ); 562 }); 563 } catch ( err ) { 564 } 565 } 566 567 if ( startIcon != '' ) { 568 569 var startMarker = L.marker( mapData[0], {icon: L.icon({ 570 iconUrl: startIcon, 571 iconSize: [ 32, 32 ], // Size of the icon. 572 iconAnchor: [ 16, 16 ] // Point of the icon which will correspond to marker's location. 573 }) 574 }); 575 576 startMarker.addTo( this.map ); 577 startMarker.title = 'Start'; 578 } 579 580 if ( endIcon != '' ) { 581 582 var endMarker = L.marker( mapData[ mapData.length - 1 ], {icon: L.icon({ 583 iconUrl: endIcon, 584 iconSize: [ 32, 32 ], // size of the icon 585 iconAnchor: [ 16, 16 ] // point of the icon which will correspond to marker's location 586 }) 587 }); 588 589 endMarker.addTo( this.map ); 590 endMarker.title = 'End'; 591 } 592 593 /* 594 var current = new google.maps.MarkerImage(currentIcon, 595 new google.maps.Size(32, 32), 596 new google.maps.Point(0,0), 597 new google.maps.Point(16, 16) 598 ); 599 600 var marker = new google.maps.Marker({ 601 position: new google.maps.LatLng(first[0], first[1]), 602 title:"Start", 603 icon: current, 604 map: map, 605 zIndex: 10 606 }); 607 608 for (i=0; i < polylinenes.length; i++) 609 { 610 611 google.maps.event.addListener(polylinenes[i],'mouseover',function(event){ 612 if (marker) 613 { 614 marker.setPosition(event.latLng); 615 marker.setTitle(lng.currentPosition); 616 if (myChart) 617 { 618 var l1 = event.latLng.lat(); 619 var l2 = event.latLng.lng(); 620 var ci = getClosestIndex(mapData,l1,l2); 621 var activeElements = []; 622 var seriesLen = myChart.data.datasets.length; 623 for(var i=0; i<seriesLen;i++) 624 { 625 activeElements.push(myChart.chart.getDatasetMeta(i).data[ci]); 626 } 627 if (activeElements.length > 0) 628 { 629 myChart.options.customLine.x = activeElements[0]._model.x; 630 if (isNaN(myChart.tooltip._eventPosition)) 631 { 632 myChart.tooltip._eventPosition = { 633 x: activeElements[0]._model.x, 634 y: activeElements[0]._model.y 635 }; 636 } 637 myChart.tooltip._active = activeElements; 638 myChart.tooltip.update(true); 639 myChart.draw(); 640 } 641 642 } 643 } 644 }); 645 } 646 */ 647 648 }, 649 650 this.AddWaypoints = function( waypoints, waypointIcon ) { 651 652 var icon = L.icon({ 653 iconUrl: 'https://maps.google.com/mapfiles/ms/micons/flag.png', 654 iconSize: [ 32, 32 ], // Size of the icon. 655 iconAnchor: [ 16, 16 ] // Point of the icon which will correspond to marker's location. 656 }); 657 658 if ( waypointIcon != '' ) { 659 icon = L.icon({ 660 iconUrl: 'waypointIcon', 661 iconSize: [ 32, 32 ], // Size of the icon.
662 iconAnchor: [ 16, 16 ] // Point of the icon which will correspond to marker's location. 663 }); 664 } 665 666 for ( i = 0; i < waypoints.length; i++ ) { 667 var wpt = waypoints[i]; 668 669 this.Bounds.push([ wpt.lat, wpt.lon ]); 670 671 var lat = wpt.lat; 672 var lon = wpt.lon; 673 var sym = wpt.sym; 674 var typ = wpt.type; 675 676 if ( icon.img ) { 677 icon.iconUrl = wpt.img; 678 wsh = ''; 679 } 680 var marker = L.marker([ lat, lon ], {icon: icon }); 681 var cnt = ''; 682 683 if ( wpt.name == '' ) { 684 cnt = "<div>" + unescape( wpt.desc ) + "</div>"; 685 } else { 686 cnt = "<div><b>" + wpt.name + "</b><br />" + unescape( wpt.desc ) + "</div>"; 687 } 688 cnt += "<br /><p><a href='https://maps.google.com?daddr=" + lat + "," + lon + "' target='_blank'>Itinéraire</a></p>"; 689 marker.addTo( this.map ).bindPopup( cnt ); 690 } 691 this.CenterMap(); 692 }, 693 694 this.MoveMarkerToPosition = function( LatLon, updateChart ) { 695 if ( null == this.CurrentPositionMarker ) 696 return; 697 698 this.CurrentPositionMarker.setLatLng( LatLon ); 699 700 if ( this.lng ) 701 this.CurrentPositionMarker.title = this.lng.currentPosition; 702 703 if ( true == updateChart && this.EventSelectChart ) 704 this.EventSelectChart( LatLon ); 705 706 }, 707 this.CenterMap = function() { 708 this.map.fitBounds( this.Bounds ); 709 }; 710 } 711 } 712}; 713 714( function( $ ) { 715 716 $.fn.wpgpxmaps = function( params ) { 717 718 var targetId = params.targetId; 719 var mapType = params.mapType; 720 var mapData = params.mapData; 721 var graphDist = params.graphDist; 722 var graphEle = params.graphEle; 723 var graphSpeed = params.graphSpeed; 724 var graphHr = params.graphHr; 725 var graphAtemp = params.graphAtemp; 726 var graphCad = params.graphCad; 727 var graphGrade = params.graphGrade; 728 var waypoints = params.waypoints; 729 var unit = params.unit; 730 var unitspeed = params.unitspeed; 731 var color1 = params.color1; 732 var color2 = params.color2; 733 var color3 = params.color3; 734 var color4 = params.color4; 735 var color5 = params.color5; 736 var color6 = params.color6; 737 var color7 = params.color7; 738 var chartFrom1 = params.chartFrom1; 739 var chartTo1 = params.chartTo1; 740 var chartFrom2 = params.chartFrom2; 741 var chartTo2 = params.chartTo2; 742 var startIcon = params.startIcon; 743 var waypointIcon = params.waypointIcon; 744 var endIcon = params.endIcon; 745 var currentIcon = params.currentIcon; 746 var zoomOnScrollWheel = params.zoomOnScrollWheel; 747 var lng = params.langs; 748 var pluginUrl = params.pluginUrl; 749 var usegpsposition = params.usegpsposition; 750 var currentpositioncon = params.currentpositioncon; 751 var ThunderforestApiKey = params.TFApiKey; 752 753 var hasThunderforestApiKey = ( ThunderforestApiKey + '' ).length > 0; 754 755 var _formats = []; 756 757 /* Unit of measure settings. */ 758 var l_s; 759 var l_x; 760 var l_y; 761 var l_grade = { suf: '%', dec: 1 }; 762 var l_hr = { suf: '', dec: 0 }; 763 var l_cad = { suf: '', dec: 0 }; 764 765 var el = document.getElementById( 'wpgpxmaps_' + targetId ); 766 var el_map = document.getElementById( 'map_' + targetId ); 767 var el_chart = document.getElementById( 'chart_' + targetId ); 768 var el_report = document.getElementById( 'report_' + targetId ); 769 var el_osm_credits = document.getElementById( 'wpgpxmaps_' + targetId + '_osm_footer' ); 770 771 var mapWidth = el_map.style.width; 772 773 var map = new WPGPXMAPS.MapEngines.Leaflet(); 774 map.lng = lng; 775 map.init( 776 'map_' + targetId, 777 mapType, 778 ( 'true' == zoomOnScrollWheel ), 779 ThunderforestApiKey 780 ); 781 782 map.EventSelectChart = function( LatLon ) { 783 784 if ( myChart ) { 785 var l1 = LatLon[0]; 786 var l2 = LatLon[1]; 787 var ci = getClosestIndex( mapData, l1, l2 ); 788 var activeElements = []; 789 var seriesLen = myChart.data.datasets.length; 790 for ( var i = 0; i < seriesLen;i++ ) { 791 activeElements.push( myChart.chart.getDatasetMeta( i ).data[ci]); 792 } 793 if ( activeElements.length > 0 ) { 794 myChart.options.customLine.x = activeElements[0]._model.x; 795 if ( isNaN( myChart.tooltip._eventPosition ) ) { 796 myChart.tooltip._eventPosition = { 797 x: activeElements[0]._model.x, 798 y: activeElements[0]._model.y 799 }; 800 } 801 myChart.tooltip._active = activeElements; 802 myChart.tooltip.update( true ); 803 myChart.draw(); 804 } 805 } 806 }; 807 808 // var bounds = new google.maps.LatLngBounds(); 809 810 if ( 'true' == usegpsposition ) { 811 812 /* Try HTML5 geolocation. */
813 if ( navigator.geolocation ) { 814 var context = map; 815 navigator.geolocation.watchPosition( function( position ) { 816 var radius = position.coords.accuracy / 2; 817 818 /* User position. */ 819 var pos = [ position.coords.latitude, position.coords.longitude ]; 820 821 if ( null == context.CurrentGPSPositionMarker ) { 822 if ( '' == currentpositioncon ) { 823 currentpositioncon = 'https://maps.google.com/mapfiles/kml/pal4/icon25.png'; 824 } 825 826 context.CurrentGPSPositionMarker = L.marker( pos, {icon: L.icon({ 827 iconUrl: currentpositioncon, 828 iconSize: [ 32, 32 ], // Size of the icon. 829 iconAnchor: [ 16, 16 ] // Point of the icon which will correspond to marker's location. 830 }) 831 }) 832 .addTo( context.map ) 833 .bindPopup( lng.currentPosition ) 834 .openPopup(); 835 836 } else { 837 context.CurrentGPSPositionMarker.setLatLng( pos ); 838 } 839 context.Bounds.push( pos ); 840 context.CenterMap(); 841 }, 842 function( e ) { 843 844 // Some errors. 845 846 }, 847 {
848 enableHighAccuracy: false, 849 timeout: 5000, 850 maximumAge: 0 851 }); 852 } 853 } 854 855 /* Print WayPoints. */ 856 if ( ! jQuery.isEmptyObject( waypoints ) && waypoints.length > 0 ) { 857 map.AddWaypoints( waypoints, waypointIcon ); 858 } 859 860 /* Print Images. */ 861 jQuery( "#ngimages_" + targetId ).attr( "style", "display:block;position:absolute;left:-50000px" ); 862 863 var nggImages = jQuery( "#ngimages_" + targetId + " span" ).toArray(); 864 865 if ( nggImages !== undefined && nggImages.length > 0 ) { 866 var photos = []; 867 868 for ( var i = 0; i < nggImages.length; i++ ) { 869 870 var ngg_span = nggImages[i]; 871 var ngg_span_a = ngg_span.children[0]; 872 873 var pos = [ 874 Number( ngg_span.getAttribute( 'lat' ) ), 875 Number( ngg_span.getAttribute( 'lon' ) ) 876 ]; 877 878 map.Bounds.push( pos ); 879 880 photos.push({ 881 'lat': pos[0], 882 'lng': pos[1], 883 'name': ngg_span_a.getAttribute( 'data-title' ), 884 'url': ngg_span_a.getAttribute( 'data-src' ), 885 'thumbnail': ngg_span_a.getAttribute( 'data-thumbnail' ) 886 }); 887 888 } 889 890 if ( photos.length > 0 ) { 891 var photoLayer = L.photo.cluster().on( 'click', function( evt ) { 892 var photo = evt.layer.photo; 893 var template = '<img src="{url}" /></a><p>{name}</p>'; 894 evt.layer.bindPopup( L.Util.template( template, photo ), { 895 minWidth: 'auto' 896 }).openPopup(); 897 }); 898 899 photoLayer.add( photos ).addTo( map.map ); 900 901 map.CenterMap(); 902 903 /* 904 var showHideImagesCustomControl = L.Control.extend({ 905 906 options: { 907 position: 'topleft' 908 //control position - allowed: 'topleft', 'topright', 'bottomleft', 'bottomright' 909 }, 910 911 onAdd: function (map) { 912 913 var container = document.createElement('img'); 914 container.class= "leaflet-bar leaflet-control leaflet-control-custom" 915 container.style.backgroundColor = 'white'; 916 container.style.width = '30px'; 917 container.style.height = '30px'; 918 container.src = pluginUrl + "/wp-gpx-maps/img/hideImages.png"; 919 container.style.cursor = 'pointer'; 920 container.title = lng.hideImages; 921 922 container.onclick = function(){ 923 924 var isImagesHidden = (controlUIhi.isImagesHidden == true); 925 var mapDiv = map.getDiv(); 926 var center = map.getCenter(); 927 928 if (isImagesHidden) 929 { 930 for (var i=0; i<ngImageMarkers.length; i++) { 931 ngImageMarkers[i].setMap(map); 932 } 933 controlUIhi.src = pluginUrl + "/wp-gpx-maps/img/hideImages.png"; 934 controlUIhi.title = lng.hideImages; 935 } 936 else 937 { 938 for (var i=0; i<ngImageMarkers.length; i++) { 939 ngImageMarkers[i].setMap(null); 940 } 941 controlUIhi.src = pluginUrl + "/wp-gpx-maps/img/showImages.png"; 942 controlUIhi.title = lng.showImages; 943 } 944 controlUIhi.isImagesHidden = !isImagesHidden; 945 return false; 946 947 } 948 949 return container; 950 }, 951 952 }); 953 954 map.map.addControl(new showHideImagesCustomControl()); 955 */ 956 957 } 958 959 } 960 961 /* 962 963 // Nextgen Pro Lightbox FIX 964 var _xx = jQuery("#ngimages_" + targetId + " .nextgen_pro_lightbox"); 965 if (_xx.length > 0) 966 { 967 968 var rnd1 = Math.random().toString(36).substring(7); 969 var rnd2 = Math.random().toString(36).substring(7); 970 971 //get first gallery without images 972 for (var _temp in galleries) { 973 var _gal = galleries[_temp]; 974 975 if (_gal.source == "random_images" && _gal.wpgpxmaps != true ) 976 { 977 978 _gal.source == "galleries"; 979 _gal.wpgpxmaps = true; 980 _transient_id = _temp.replace("gallery_","") 981 _gal["entity_ids"] = []; 982 _gal["image_ids"] = []; 983 _gal["gallery_ids"] = [96]; 984 for (var i=0;i<_xx.length;i++) 985 { 986 var __xx = jQuery(_xx[i]); 987 __xx.attr("data-nplmodal-gallery-id", _transient_id); 988 _gal["image_ids"].push(__xx.attr("data-image-id")); 989 } 990 break; 991 } 992 } 993 } 994 */ 995 996 /* Print Track. */ 997 if ( mapData != '' ) { 998 map.AppPolylines( mapData, color1, currentIcon, startIcon, endIcon ); 999 } 1000 1001 /* 1002 map.setCenter(bounds.getCenter()); 1003 map.fitBounds(bounds); 1004 */ 1005 1006 // Fix post tabs. */ 1007 var $_tab = $( el ).closest( ".wordpress-post-tabs, .tab-pane" ).eq( 0 ); 1008 if ( $_tab ) { 1009 var contextMap = map; 1010 1011 var FixMapSize = function( e ) { 1012 setTimeout( function( e ) { 1013 1014 // google.maps.event.trigger(map, 'resize'); 1015 contextMap.map.invalidateSize(); 1016 contextMap.CenterMap(); 1017 tabResized = true; 1018 }, 300 ); 1019 }; 1020
1021 $( ".wpsm_nav-tabs a" ).click( FixMapSize ); 1022 1023 $( "div > ul > li > a", $_tab ).click( FixMapSize ); 1024 } 1025 1026 1027 var graphh = jQuery( '#myChart_' + params.targetId ).css( "height" ); 1028 1029 if ( graphDist != '' && ( graphEle != '' || graphSpeed != '' || graphHr != '' || graphAtemp != '' || graphCad != '' ) && graphh != '0px' ) { 1030 1031 var valLen = graphDist.length; 1032 1033 1034 if ( '1' == unit ) { 1035 1036 /* feet / miles */ 1037 l_x = { suf: 'mi', dec: 1 }; 1038 l_y = { suf: 'ft', dec: 0 }; 1039 1040 } else if ( '2' == unit ) { 1041 1042 /* meters / kilometers */ 1043 l_x = { suf: 'km', dec: 1 }; 1044 l_y = { suf: 'm', dec: 0 }; 1045 1046 } else if ( '3' == unit ) { 1047 1048 /* meters / nautical miles */ 1049 l_x = { suf: 'NM', dec: 1 }; 1050 l_y = { suf: 'm', dec: 0 }; 1051 1052 } else if ( '4' == unit ) { 1053 1054 /* meters / miles */ 1055 l_x = { suf: 'mi', dec: 1 }; 1056 l_y = { suf: 'm', dec: 0 }; 1057 1058 } else if ( '5' == unit ) { 1059 1060 /* feet / nautical miles */ 1061 l_x = { suf: 'NM', dec: 1 }; 1062 l_y = { suf: 'ft', dec: 0 }; 1063 1064 } else { 1065 1066 /* meters / meters */ 1067 l_x = { suf: 'm', dec: 0 }; 1068 l_y = { suf: 'm', dec: 0 }; 1069 1070 } 1071 1072 var nn = 1111.1; 1073 var _nn = nn.toLocaleString(); 1074 var _nnLen = _nn.length; 1075 var decPoint = _nn.substring( _nnLen - 2, _nnLen - 1 ); 1076 var thousandsSep = _nn.substring( 1, 2 ); 1077 1078 if ( '1' == decPoint ) 1079 decPoint = '.'; 1080 1081 if ( '1' == thousandsSep ) 1082 thousandsSep = ''; 1083 1084 /* Define the options. */ 1085 var hoptions = { 1086 type: 'line', 1087 data: { 1088 datasets: [] 1089 }, 1090 borderWidth: 1, 1091 options: { 1092 animation: { 1093 1094 // duration: 0, 1095 // general animation time 1096 }, 1097 hover: { 1098 1099 // animationDuration: 0, 1100 // duration of animations when hovering an item 1101 }, 1102 1103 // responsiveAnimationDuration: 0, 1104 // animation duration after a resize 1105 customLine: { 1106 color: 'gray' 1107 }, 1108 scales: { 1109 yAxes: [], 1110 xAxes: [ { 1111 type: 'linear', 1112 ticks: { 1113 suggestedMin: 0, 1114 max: graphDist[graphDist.length - 1], 1115 1116 /* Include a dollar sign in the ticks. */ 1117 callback: function( value, index, values ) { 1118 return Math.round( value, l_x.dec ) + l_x.suf; 1119 } 1120 } 1121 } ] 1122 }, 1123 tooltips: { 1124 position: 'average', 1125 mode: 'index', 1126 intersect: false, 1127 callbacks: { 1128 title: function( tooltipItems, data ) { 1129 1130 /* Return value for title: */ 1131 var fpt = _formats[0]; 1132 return Math.round( tooltipItems[0].xLabel, fpt.dec ) + fpt.suf;; 1133 }, 1134 label: function( tooltipItem, data ) { 1135 1136 /* Format list values: */ 1137 var label = data.datasets[tooltipItem.datasetIndex].label || ''; 1138 var fpt = _formats[tooltipItem.datasetIndex]; 1139 if ( label ) { 1140 label += ': '; 1141 } 1142 label += Math.round( tooltipItem.yLabel, fpt.dec ) + fpt.suf; 1143 return label; 1144 }, 1145 footer: function( tooltipItem ) { 1146 1147 /* Move the point in map. */ 1148 var i = tooltipItem[0].index; 1149 var point = WPGPXMAPS.Utils.GetItemFromArray( mapData, i ); 1150 map.MoveMarkerToPosition( point, false ); 1151 } 1152 } 1153 } 1154 }, 1155 1156 plugins: [ { 1157 beforeEvent: function( chart, e ) { 1158 if ( ( e.type === 'mousemove' ) 1159 && ( e.x >= e.chart.chartArea.left ) 1160 && ( e.x <= e.chart.chartArea.right ) 1161 ) { 1162 chart.options.customLine.x = e.x; 1163 } 1164 }, 1165 afterDraw: function( chart, easing ) { 1166 var ctx = chart.chart.ctx; 1167 var chartArea = chart.chartArea; 1168 var x = chart.options.customLine.x; 1169 if ( ! isNaN( x ) ) { 1170 ctx.save(); 1171 ctx.strokeStyle = chart.options.customLine.color; 1172 ctx.moveTo( chart.options.customLine.x, chartArea.bottom ); 1173 ctx.lineTo( chart.options.customLine.x, chartArea.top ); 1174 ctx.stroke(); 1175 ctx.restore(); 1176 } 1177 } 1178 } ], 1179 labels: graphDist 1180 }; 1181 1182 if ( graphEle != '' ) { 1183 var myData = mergeArrayForChart( graphDist, graphEle ); 1184 var yaxe = { 1185 type: 'linear', 1186 ticks: { 1187 1188 /* Include a dollar sign in the ticks. */ 1189 callback: function( value, index, values ) { 1190 return Math.round( value, l_y.dec ) + l_y.suf; 1191 } 1192 }, 1193 id: 'y-axis-' + ( hoptions.options.scales.yAxes.length + 1 ) 1194 }; 1195 1196 if ( chartFrom1 != '' ) { 1197 1198 yaxe.min = chartFrom1; 1199 yaxe.startOnTick = false; 1200 1201 } else { 1202 1203 yaxe.min = myData.Min; 1204 1205 } 1206 1207 if ( chartTo1 != '' ) { 1208 1209 yaxe.max = chartTo1; 1210 yaxe.endOnTick = false; 1211 1212 } else { 1213 1214 yaxe.max = myData.Max; 1215 } 1216 1217 _formats.push( l_y ); 1218 hoptions.options.scales.yAxes.push( yaxe ); 1219 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.altitude, myData.Items, color2, yaxe.id ) ); 1220 1221 } 1222 1223 if ( graphSpeed != '' ) { 1224 1225 if ( '6' == unitspeed ) { 1226 1227 /* min/100 meters */ 1228 l_s = { suf: 'min/100m', dec: 2 }; 1229 1230 } else if ( '5' == unitspeed ) { 1231 1232 /* knots */ 1233 l_s = { suf: 'knots', dec: 2 }; 1234 1235 } else if ( '4' == unitspeed ) { 1236 1237 /* min/miles */ 1238 l_s = { suf: 'min/mi', dec: 2 }; 1239 1240 } else if ( '3' == unitspeed ) { 1241 1242 /* min/km */ 1243 l_s = { suf: 'min/km', dec: 2 }; 1244 1245 } else if ( '2' == unitspeed ) { 1246 1247 /* miles/h */ 1248 l_s = { suf: 'mi/h', dec: 0 }; 1249 1250 } else if ( '1' == unitspeed ) { 1251 1252 /* km/h */ 1253 l_s = { suf: 'km/h', dec: 0 }; 1254 1255 } else { 1256 1257 /* dafault m/s */ 1258 l_s = { suf: 'm/s', dec: 0 }; 1259 1260 } 1261 1262 var myData = mergeArrayForChart( graphDist, graphSpeed ); 1263 var yaxe = { 1264 type: 'linear', 1265 ticks: { 1266 1267 /* Include a dollar sign in the ticks. */ 1268 callback: function( value, index, values ) { 1269 return Math.round( value, l_s.dec ) + l_s.suf; 1270 } 1271 }, 1272 position: 'right', 1273 scalePositionLeft: false, 1274 id: 'y-axis-' + ( hoptions.options.scales.yAxes.length + 1 ) 1275 }; 1276 1277 if ( chartFrom2 != '' ) { 1278 1279 yaxe.min = chartFrom2; 1280 yaxe.startOnTick = false; 1281 1282 } else { 1283 yaxe.min = myData.Min; 1284 } 1285 1286 if ( chartTo2 != '' ) { 1287 1288 yaxe.max = chartTo2; 1289 yaxe.endOnTick = false; 1290 1291 } else { 1292 yaxe.max = myData.Max; 1293 } 1294 1295 _formats.push ( l_s ); 1296 hoptions.options.scales.yAxes.push( yaxe ); 1297 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.speed, myData.Items, color3, yaxe.id ) ); 1298 } 1299 1300 if ( graphHr != '' ) { 1301 var myData = mergeArrayForChart( graphDist, graphHr ); 1302 var yaxe = { 1303 type: 'linear', 1304 ticks: { 1305 1306 /* Include a dollar sign in the ticks. */ 1307 callback: function( value, index, values ) { 1308 return Math.round( value, l_hr.dec ) + l_hr.suf; 1309 } 1310 }, 1311 position: 'right', 1312 scalePositionLeft: false, 1313 id: 'y-axis-' + ( hoptions.options.scales.yAxes.length + 1 ) 1314 }; 1315 hoptions.options.scales.yAxes.push( yaxe ); 1316 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.heartRate, myData.Items, color4, yaxe.id ) ); 1317 _formats.push( l_hr ); 1318 } 1319 1320 if ( graphAtemp != '' ) { 1321 var myData = mergeArrayForChart( graphDist, graphAtemp ); 1322 var yaxe = { 1323 type: 'linear', 1324 ticks: { 1325 1326 /* Include a dollar sign in the ticks. */ 1327 callback: function( value, index, values ) { 1328 return Math.round( value, 1 ) + "°C"; 1329 } 1330 }, 1331 position: 'right', 1332 scalePositionLeft: false, 1333 id: 'y-axis-' + ( hoptions.options.scales.yAxes.length + 1 ) 1334 }; 1335 hoptions.options.scales.yAxes.push( yaxe ); 1336 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.atemp, my
1336Data.Items, color7, yaxe.id ) ); 1337 _formats.push({ suf: '°C', dec: 1 }); 1338 } 1339 1340 1341 if ( graphCad != '' ) { 1342 1343 var myData = mergeArrayForChart( graphDist, graphCad, true ); 1344 var yaxe = { 1345 type: 'linear', 1346 ticks: { 1347 1348 // Include a dollar sign in the ticks. 1349 callback: function( value, index, values ) { 1350 return Math.round( value, l_cad.dec ) + l_cad.suf; 1351 } 1352 }, 1353 position: 'right', 1354 scalePositionLeft: false, 1355 id: 'y-axis-' + ( hoptions.options.scales.yAxes.length + 1 ) 1356 }; 1357 1358 hoptions.options.scales.yAxes.push( yaxe ); 1359 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.cadence, myData.Items, color5, yaxe.id ) ); 1360 _formats.push( l_cad ); 1361 1362 } 1363 1364 if ( graphGrade != '' ) { 1365 1366 var myData = mergeArrayForChart( graphDist, graphGrade ); 1367 var yaxe = { 1368 type: 'linear', 1369 ticks: { 1370 1371 // Include a dollar sign in the ticks. 1372 callback: function( value, index, values ) { 1373 return Math.round( value, l_grade.dec ) + l_grade.suf; 1374 } 1375 }, 1376 position: 'right', 1377 scalePositionLeft: false, 1378 id: "y-axis-" + ( hoptions.options.scales.yAxes.length + 1 ) 1379 }; 1380 1381 _formats.push( l_grade ); 1382 hoptions.options.scales.yAxes.push( yaxe ); 1383 hoptions.data.datasets.push( wpgpxmapsGetDataset( lng.grade, myData.Items, color6, yaxe.id ) ); 1384 } 1385 1386 var ctx = document.getElementById( 'myChart_' + params.targetId ).getContext( '2d' ); 1387 var myChart = new Chart( ctx, hoptions ); 1388 1389 } else { 1390 jQuery( '#myChart_' + params.targetId ).css( "display", "none" ); 1391 } 1392 1393 return this; 1394 }; 1395 1396 function mergeArrayForChart( distArr, dataArr, setZerosAsNull ) { 1397 var l = distArr.length; 1398 1399 var items = new Array( l ); 1400 var min = 10000; 1401 var max = -10000; 1402 1403 for ( i = 0; i < l; i++ ) { 1404 if ( distArr[i] != null ) { 1405 var _item = dataArr[i]; 1406 1407 if ( setZerosAsNull === true && _item === 0 ) { 1408 _item = null; 1409 } 1410 1411 items[i] = { 1412 x: distArr[i], 1413 y: _item 1414 }; 1415 if ( _item > max ) 1416 max = _item; 1417 if ( _item < min ) 1418 min = _item; 1419 } 1420 } 1421 return { 1422 Items: items, 1423 Min: min, 1424 Max: max 1425 }; 1426 } 1427 1428 function wpgpxmapsGetDataset( name, data, color, id ) { 1429 return { 1430 label: name, // jQuery("<div/>").html(name).text(), // convert html special chars to text, ugly but it works 1431 data: data, 1432 borderColor: color, 1433 backgroundColor: hexToRgbA( color, .3 ), 1434 pointRadius: 0, 1435 borderWidth: 1, 1436 pointHoverRadius: 1, 1437 yAxisID: id 1438 }; 1439 } 1440 1441 function hexToRgbA( hex, a ) { 1442 var c; 1443 if ( /^#([A-Fa-f0-9]{3}){1,2}$/.test( hex ) ) { 1444 c = hex.substring( 1 ).split( '' ); 1445 if ( c.length == 3 ) { 1446 c = [ c[0], c[0], c[1], c[1], c[2], c[2] ]; 1447 } 1448 c = '0x' + c.join( '' ); 1449 return 'rgba(' + [ ( c>>16 )&255, ( c>>8 )&255, c&255 ].join( ',' ) + ',' + a + ' )'; 1450 } 1451 throw new Error( 'Bad Hex' ); 1452 } 1453 1454 1455 function getItemFromArray( arr, index ) { 1456 try { 1457 return arr[index]; 1458 } catch ( e ) { 1459 return [ 0, 0 ]; 1460 } 1461 } 1462 1463 1464 function getClosestIndex( points, lat, lon ) { 1465 var dd = 10000; 1466 var ii = 0; 1467 for ( i = 0; i < points.length; i++ ) { 1468 if ( null == points[i]) 1469 continue; 1470 1471 var d = wpgpxmapsDist( points[i][0], points[i][1], lat, lon ); 1472 if ( d < dd ) { 1473 ii = i; 1474 dd = d; 1475 } 1476 } 1477 return ii; 1478 } 1479 1480 function getClosestImage( lat, lon, targetId ) { 1481 var dd = 10000; 1482 var img; 1483 var divImages = document.getElementById( "ngimages_" + targetId ); 1484 var img_spans = divImages.getElementsByTagName( "span" ); 1485 for ( var i = 0; i < img_spans.length; i++ ) { 1486 var imageLat = img_spans[i].getAttribute( 'lat' ); 1487 var imageLon = img_spans[i].getAttribute( 'lon' ); 1488 1489 imageLat = imageLat.replace( ",", "." ); 1490 imageLon = imageLon.replace( ",", "." ); 1491 1492 var d = wpgpxmapsDist( imageLat, imageLon, lat, lon ); 1493 if ( d < dd ) { 1494 img = img_spans[i]; 1495 dd = d; 1496 } 1497 } 1498 return img; 1499 } 1500 1501 function isNumeric( input ) { 1502 var RE = /^-{0,1}\d*\.{0,1}\d+$/; 1503 return ( RE.test( input ) ); 1504 } 1505 1506 function wpgpxmapsDist( lat1, lon1, lat2, lon2 ) { 1507 1508 // Mathematically not correct but fast. 1509 var dLat = ( lat2 - lat1 ); 1510 var dLon = ( lon2 - lon1 ); 1511 return Math.sqrt( dLat * dLat + dLon * dLon ); 1512 } 1513 1514}( jQuery ) );
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.