1/* 2 * Copyright (c) 2008-2012 Mark C. Prins <mprins@users.sf.net> 3 * 4 * Permission to use, copy, modify, and distribute this software for any 5 * purpose with or without fee is hereby granted, provided that the above 6 * copyright notice and this permission notice appear in all copies. 7 * 8 * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 9 * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 10 * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 11 * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 12 * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 13 * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 14 * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 15 */ 16 17/** 18 * @fileoverview Javascript voor OpenLayers plugin. 19 * 20 * @requires {lib/OpenLayers.js} or a full openlayers build 21 * @author Mark C. Prins <mc.prins@gmail.com> 22 * 23 */ 24 25/** 26 * Openlayers selectcontrol. 27 * 28 * @type {OpenLayers.Control.SelectFeature} 29 * @private 30 */ 31var selectControl; 32 33/** 34 * handle feature select event. 35 * 36 * @param {OpenLayers.Feature.Vector} 37 * the selected feature 38 */ 39function onFeatureSelect(feature) { 40 var selectedFeature = feature; 41 // 'this' is selectFeature control 42 var pPos = selectedFeature.geometry.getBounds().getCenterLonLat(); 43 // != OpenLayers.Geometry.Point 44 if (selectedFeature.geometry.CLASS_NAME === "OpenLayers.Geometry.LineString") { 45 try { 46 // for lines make the popup show at the cursor position 47 pPos = feature.layer.map.getLonLatFromViewPortPx(this.handlers.feature.evt.xy); 48 } catch (anErr) { 49 OpenLayers.Console 50 .warn("unable to get event position; reverting to boundingbox center."); 51 pPos = selectedFeature.geometry.getBounds().getCenterLonLat(); 52 } 53 } 54 55 var pContent = '<div class="spacer"> </div>'; 56 if (feature.data.rowId !== undefined) { 57 pContent += '<span class="rowId">' + feature.data.rowId + ': </span>'; 58 } 59 if (feature.data.name !== undefined) { 60 pContent += '<span class="txt">' + feature.data.name + '</span>'; 61 } 62 if (feature.data.ele !== undefined) { 63 pContent += '<div class="ele">elevation: ' + feature.data.ele + '</div>'; 64 } 65 if (feature.data.type !== undefined) { 66 pContent += '<div>' + feature.data.type + '</div>'; 67 } 68 if (feature.data.time !== undefined) { 69 pContent += '<div class="time">time: ' + feature.data.time + '</div>'; 70 } 71 if (feature.data.description !== undefined) { 72 pContent += '<div class="desc">' + feature.data.description + '</div>'; 73 } 74 75 if (pContent.length > 0) { 76 // only show when there is something to show... 77 var popup = new OpenLayers.Popup.FramedCloud( 78 "olPopup", pPos, null, pContent, null, !0, function() { 79 selectControl.unselect(selectedFeature); 80 }); 81 feature.popup = popup; 82 feature.layer.map.addPopup(popup); 83 } 84} 85 86/** 87 * handle feature unselect event. remove & destroy the popup. 88 * 89 * @param {OpenLayers.Feature.Vector} 90 * the un-selected feature 91 */ 92function onFeatureUnselect(feature) { 93 if (feature.popup !== null) { 94 feature.layer.map.removePopup(feature.popup); 95 feature.popup.destroy(); 96 feature.popup = null; 97 } 98} 99/** 100 * Test for css support in the browser by sniffing for a css class we added 101 * using javascript added by the action plugin; this is an edge case because 102 * browsers that support javascript generally support css as well. 103 * 104 * @returns {Boolean} true when the browser supports css (and implicitly 105 * javascript) 106 */ 107function olTestCSSsupport() { 108 // return (((getElementsByClass('olCSSsupported', null, null))).length > 0); 109 return (jQuery('.olCSSsupported').length > 0); 110} 111 112/** 113 * creates a DocumentFragment to insert into the dom. 114 * 115 * @param mapid 116 * id for the map div 117 * @param width 118 * width for the map div 119 * @param height 120 * height for the map div 121 * @returns a {DocumentFragment} element that can be injected into the dom 122 */ 123function olCreateMaptag(mapid, width, height) { 124 var mEl = 125 '<div id="' 126 + mapid 127 + '-olContainer" class="olContainer olWebOnly">' 128 + '<div id="' 129 + mapid 130 + '-olToolbar" class="olToolbar"></div>' 131 + '<div class="clearer"></div>' 132 + '<div id="' 133 + mapid 134 + '" style="width:' 135 + width 136 + ';height:' 137 + height 138 + ';" class="olMap"></div>' 139 + '<div id="' + mapid 140 + '-olStatusBar" class="olStatusBarContainer">' 141 + '<div id="' + mapid 142 + '-statusbar-scale" class="olStatusBar olStatusBarScale">scale</div>' 143 + '<div id="' + mapid 144 + '-statusbar-link" class="olStatusBar olStatusBarPermalink"><a href="" id="' 145 + mapid 146 + '-statusbar-link-ref">map link</a></div>' 147 + '<div id="' + mapid 148 + '-statusbar-mouseposition" class="olStatusBar olStatusBarMouseposition"></div>' 149 + '<div id="' + mapid 150 + '-statusbar-projection" class="olStatusBar olStatusBarProjection">proj</div>' 151 + '<div id="' + mapid 152 + '-statusbar-text" class="olStatusBar olStatusBarText">txt</div>' 153 + '</div>\n</div>', 154 // fragment 155 frag = document.createDocumentFragment(), 156 // temp node 157 temp = document.createElement('div'); 158 temp.innerHTML = mEl; 159 while (temp.firstChild) { 160 frag.appendChild(temp.firstChild); 161 } 162 return frag; 163} 164 165/** 166 * create the map based on the params given. 167 * 168 * @param {Object}mapOpts 169 * MapOptions hash {id:'olmap', width:500px, height:500px, 170 * lat:6710200, lon:506500, zoom:13, toolbar:1, statusbar:1, 171 * controls:1, poihoverstyle:1, baselyr:'', kmlfile:'', gpxfile:'', 172 * summary:''} 173 * @param {Array}OLmapPOI 174 * array with POI's [ {lat:6710300,lon:506000,txt:'instap 175 * punt',angle:180,opacity:.9,img:'', rowId:n},... ]); 176 * 177 */ 178function createMap(mapOpts, OLmapPOI) { 179 if (!olEnable) { 180 return; 181 } 182 if (!olTestCSSsupport()) { 183 olEnable = !1; 184 return; 185 } 186 187 var DocBase = DOKU_BASE; 188 189 OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3; 190 // OpenLayers.Util.onImageLoadErrorColor = 'transparent'; 191 // OpenLayers.Util.onImageLoadError = function() { 192 // /* transparent gif */ 193 // // IE 8 complains w/ stack overflow... 194 // this.src = 195 // "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAQAIBRAA7"; 196 // // this.src = DocBase + "lib/plugins/openlayersmap/lib/img/blank.gif"; 197 // }; 198 199 // OpenLayers.Layer.Vector.prototype.renderers = ["SVG", "VML"]; 200 201 // find map element location 202 var cleartag = document.getElementById(mapOpts.id + '-clearer'); 203 if (cleartag === null) { 204 return; 205 } 206 // create map element and add to document 207 var fragment = olCreateMaptag( 208 mapOpts.id, mapOpts.width, mapOpts.height); 209 cleartag.parentNode.insertBefore( 210 fragment, cleartag); 211 212 /** dynamic map extent. */ 213 var extent = new OpenLayers.Bounds(), 214 215 /** map. */ 216 m = 217 new OpenLayers.Map( 218 { 219 div : mapOpts.id, 220 projection : 'EPSG:900913', 221 displayProjection : new OpenLayers.Projection( 222 "EPSG:4326"), 223 // units : 'm', 224 // maxResolution : 156543.0339, 225 // maxExtent : new OpenLayers.Bounds(-20037508.34, 226 // -20037508.34, 227 // 20037508.34, 20037508.34), 228 numZoomLevels : 22, 229 controls : [ 230 new OpenLayers.Control.ArgParser(), 231 new OpenLayers.Control.KeyboardDefaults(), 232 new OpenLayers.Control.Navigation( 233 { 234 dragPanOptions : { 235 enableKinetic : !0 236 } 237 }), new OpenLayers.Control.ScaleLine( 238 { 239 geodesic : !0 240 }) 241 ], 242 theme : null 243 }); 244 245 if (osmEnable) { 246 /* add OSM map layers */ 247 m.addLayer(new OpenLayers.Layer.OSM( 248 "OpenStreetMap", null, { 249 transitionEffect : 'resize', 250 visibility : mapOpts.baselyr === "OpenStreetMap" 251 })); 252 253 m 254 .addLayer(new OpenLayers.Layer.OSM( 255 "transport", 256 [ 257 "http://a.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png", 258 "http://b.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png", 259 "http://c.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png" 260 ], 261 { 262 transitionEffect : 'resize', 263 attribution : 'Data CC-By-SA <a href="http://openstreetmap.org/" target="_blank">OpenStreetMap</a>, ' 264 + 'Tiles <a href="http://opencyclemap.org/" target="_blank">OpenCycleMap</a>' 265 + '<img src="http://opencyclemap.org/favicon.ico" alt="OpenCycleMap logo"/>', 266 visibility : mapOpts.baselyr === "transport", 267 tileOptions : { 268 crossOriginKeyword : null 269 } 270 })); 271 m 272 .addLayer(new OpenLayers.Layer.OSM( 273 "landscape", 274 [ 275 "http://a.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png", 276 "http://b.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png", 277 "http://c.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png" 278 ], 279 { 280 transitionEffect : 'resize', 281 attribution : 'Data CC-By-SA <a href="http://openstreetmap.org/" target="_blank">OpenStreetMap</a>, ' 282 + 'Tiles <a href="http://opencyclemap.org/" target="_blank">OpenCycleMap</a>' 283 + '<img src="http://opencyclemap.org/favicon.ico" alt="OpenCycleMap logo"/>', 284 visibility : mapOpts.baselyr === "transport", 285 tileOptions : { 286 crossOriginKeyword : null 287 } 288 })); 289 m 290 .addLayer(new OpenLayers.Layer.OSM( 291 "cycle map", 292 [ 293 "http://a.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png", 294 "http://b.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png", 295 "http://c.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png" 296 ], 297 { 298 transitionEffect : 'resize', 299 attribution : 'Data CC-By-SA <a href="http://openstreetmap.org/" target="_blank">OpenStreetMap</a>, ' 300 + 'Tiles <a href="http://opencyclemap.org/" target="_blank">OpenCycleMap</a>' 301 + '<img src="http://opencyclemap.org/favicon.ico" alt="OpenCycleMap logo"/>', 302 visibility : mapOpts.baselyr === "cycle map", 303 tileOptions : { 304 crossOriginKeyword : null 305 } 306 })); 307 308 m 309 .addLayer(new OpenLayers.Layer.OSM( 310 "cloudmade map", 311 [ 312 "http://a.tile.cloudmade.com/2f59745a6b525b4ebdb100891d5b6711/3/256/${z}/${x}/${y}.png", 313 "http://b.tile.cloudmade.com/2f59745a6b525b4ebdb100891d5b6711/3/256/${z}/${x}/${y}.png", 314 "http://c.tile.cloudmade.com/2f59745a6b525b4ebdb100891d5b6711/3/256/${z}/${x}/${y}.png" 315 ], 316 { 317 transitionEffect : 'resize', 318 attribution : 'Tiles © 2012 <a target="_blank" href="http://cloudmade.com">CloudMade</a>' 319 + '<img src="http://cloudmade.com/favicon.ico" alt="CloudMade logo"/>' 320 + ' Data CC-BY-SA <a href="http://openstreetmap.org/" target="_blank">OpenStreetMap</a>', 321 visibility : mapOpts.baselyr === "cloudmade map", 322 tileOptions : { 323 crossOriginKeyword : null 324 } 325 })); 326 327 m.addLayer(new OpenLayers.Layer.OSM( 328 "hike and bike map", "http://toolserver.org/tiles/hikebike/${z}/${x}/${y}.png", { 329 transitionEffect : 'resize', 330 visibility : mapOpts.baselyr === "hike and bike map", 331 tileOptions : { 332 crossOriginKeyword : null 333 } 334 })); 335 } 336 /* 337 * add MapQuest map layers, see: 338 * http://developer.mapquest.com/web/products/open/map 339 */ 340 if (mqEnable) { 341 m 342 .addLayer(new OpenLayers.Layer.OSM( 343 "mapquest road", 344 [ 345 "http://otile1.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png", 346 "http://otile2.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png", 347 "http://otile3.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png", 348 "http://otile4.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png" 349 ], 350 { 351 transitionEffect : 'resize', 352 attribution : 'Data CC-By-SA <a href="http://openstreetmap.org/" target="_blank">OpenStreetMap</a>, ' 353 + 'Tiles <a href="http://www.mapquest.com/" target="_blank">MapQuest</a>' 354 + '<img src="http://developer.mapquest.com/content/osm/mq_logo.png" alt="MapQuest logo"/>', 355 visibility : mapOpts.baselyr === "mapquest road", 356 tileOptions : { 357 crossOriginKeyword : null 358 } 359 })); 360 // note that global coverage is provided at zoom levels 0-11. Zoom 361 // Levels 12+ are provided only in the United States (lower 48). 362 m 363 .addLayer(new OpenLayers.Layer.OSM( 364 "mapquest sat", 365 [ 366 "http://oatile1.mqcdn.com/naip/${z}/${x}/${y}.jpg", 367 "http://oatile2.mqcdn.com/naip/${z}/${x}/${y}.jpg", 368 "http://oatile3.mqcdn.com/naip/${z}/${x}/${y}.jpg", 369 "http://oatile4.mqcdn.com/naip/${z}/${x}/${y}.jpg" 370 ], 371 { 372 transitionEffect : 'resize', 373 attribution : 'Tiles Courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a>' 374 + '<img src="http://developer.mapquest.com/content/osm/mq_logo.png" alt="MapQuest logo"/>', 375 visibility : mapOpts.baselyr === "mapquest sat", 376 numZoomLevels : 12, 377 tileOptions : { 378 crossOriginKeyword : null 379 } 380 })); 381 } 382 383 if (gEnable) { 384 /* load google maps */ 385 try { 386 m.addLayer(new OpenLayers.Layer.Google( 387 "google relief", { 388 type : google.maps.MapTypeId.TERRAIN, 389 // transitionEffect : 'resize', 390 numZoomLevels : 16, 391 animationEnabled : !0, 392 visibility : mapOpts.baselyr === "google relief" 393 })); 394 m.addLayer(new OpenLayers.Layer.Google( 395 "google sat", { 396 type : google.maps.MapTypeId.SATELLITE, 397 // transitionEffect : 'resize', 398 // numZoomLevels : 22, 399 animationEnabled : !0, 400 visibility : mapOpts.baselyr === "google sat" 401 })); 402 m.addLayer(new OpenLayers.Layer.Google( 403 "google hybrid", { 404 type : google.maps.MapTypeId.HYBRID, 405 // transitionEffect : 'resize', 406 // numZoomLevels : 20, 407 animationEnabled : !0, 408 visibility : mapOpts.baselyr === "google hybrid" 409 })); 410 m.addLayer(new OpenLayers.Layer.Google( 411 "google road", { 412 // transitionEffect : 'resize', 413 // numZoomLevels : 20, 414 animationEnabled : !0, 415 visibility : mapOpts.baselyr === "google road" 416 })); 417 } catch (ol_err1) { 418 Openlayers.Console.userError('Error loading Google maps' + ol_err1); 419 } 420 } 421 422 if (bEnable && bApiKey !== '') { 423 try { 424 /* add Bing tiles */ 425 m 426 .addLayer(new OpenLayers.Layer.Bing( 427 { 428 key : bApiKey, 429 type : "Road", 430 name : 'bing road', 431 transitionEffect : 'resize', 432 visibility : mapOpts.baselyr === "bing road", 433 wrapDateLine : !0, 434 attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">' 435 + 'Bing™</a><img src="http://www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}' 436 + '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>' 437 })); 438 m 439 .addLayer(new OpenLayers.Layer.Bing( 440 { 441 key : bApiKey, 442 type : "Aerial", 443 name : 'bing sat', 444 transitionEffect : 'resize', 445 visibility : mapOpts.baselyr === "bing sat", 446 wrapDateLine : !0, 447 attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">' 448 + 'Bing™</a><img src="http://www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}' 449 + '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>' 450 })); 451 m 452 .addLayer(new OpenLayers.Layer.Bing( 453 { 454 key : bApiKey, 455 type : "AerialWithLabels", 456 name : "bing hybrid", 457 transitionEffect : 'resize', 458 visibility : mapOpts.baselyr === "bing hybrid", 459 wrapDateLine : !0, 460 attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">' 461 + 'Bing™</a><img src="http://www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}' 462 + '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>' 463 })); 464 } catch (ol_errBing) { 465 Openlayers.Console.userError('Error loading Bing maps: ' + ol_errBing); 466 } 467 } 468 469 m.setCenter( 470 new OpenLayers.LonLat( 471 mapOpts.lon, mapOpts.lat).transform( 472 m.displayProjection, m.projection), mapOpts.zoom); 473 extent.extend(m.getExtent()); 474 475 // change/set alternative baselyr 476 try { 477 m.setBaseLayer(((m.getLayersByName(mapOpts.baselyr))[0])); 478 } catch (ol_err4) { 479 m.setBaseLayer(m.layers[0]); 480 } 481 482 if (mapOpts.controls === 1) { 483 /* add base controls to map */ 484 m.addControl(new OpenLayers.Control.LayerSwitcher()); 485 m.addControl(new OpenLayers.Control.PanZoomBar()); 486 m.addControl(new OpenLayers.Control.Graticule( 487 { 488 visible : !1 489 })); 490 491 // add hillshade, since this is off by default only add when we have a 492 // layerswitcher 493 m.addLayer(new OpenLayers.Layer.OSM( 494 "Hillshade", "http://toolserver.org/~cmarqu/hill/${z}/${x}/${y}.png", { 495 transitionEffect : 'resize', 496 isBaseLayer : !1, // false 497 transparent : !0, // true 498 visibility : !1, 499 displayOutsideMaxExtent : !0, 500 attribution : '', 501 tileOptions : { 502 crossOriginKeyword : null 503 } 504 })); 505 506 m.addControl(new OpenLayers.Control.OverviewMap( 507 { 508 size : new OpenLayers.Size(140, 140), 509 //mapOptions : { 510 // theme : null , 511 // maxResolution: null // see: https://github.com/openlayers/openlayers/issues/399 512 //}, 513 minRectSize : 10 514 })); 515 } 516 517 if (mapOpts.statusbar === 1) { 518 // statusbar control: permalink 519 m.addControl(new OpenLayers.Control.Permalink( 520 mapOpts.id + '-statusbar-link-ref')); 521 // statusbar control: mouse pos. 522 // TODO kijken naar afronding met aNumber.toFixed(0) 523 m.addControl(new OpenLayers.Control.MousePosition( 524 { 525 'div' : OpenLayers.Util.getElement(mapOpts.id + '-statusbar-mouseposition') 526 })); 527 // statusbar control: scale 528 m.addControl(new OpenLayers.Control.Scale( 529 mapOpts.id + '-statusbar-scale')); 530 // statusbar control: attribution 531 m.addControl(new OpenLayers.Control.Attribution( 532 { 533 'div' : OpenLayers.Util.getElement(mapOpts.id + '-statusbar-text') 534 })); 535 // statusbar control: projection 536 OpenLayers.Util.getElement(mapOpts.id + '-statusbar-projection').innerHTML = 537 m.displayProjection; 538 } else { 539 OpenLayers.Util.getElement(mapOpts.id + '-olStatusBar').display = 'none'; 540 } 541 542 if (mapOpts.toolbar === 1) { 543 // add buttons + panel 544 var /* zoom in btn */ 545 zoomin = new OpenLayers.Control.ZoomBox( 546 { 547 title : "Zoom in" 548 }), /* zoom out btn */ 549 zoomout = new OpenLayers.Control.ZoomBox( 550 { 551 out : !0, 552 title : "Zoom uit", 553 displayClass : "olControlZoomOut" 554 }), /* pan btn */pan = new OpenLayers.Control.DragPan( 555 { 556 title : "Verschuif" 557 }), /* do "nothing" button... */info = new OpenLayers.Control.Button( 558 { 559 type : OpenLayers.Control.TYPE_TOOL, 560 displayClass : "olControlFeatureInfo", 561 title : "Info" 562 }), /* navigation history btns */ 563 nav = new OpenLayers.Control.NavigationHistory(); 564 m.addControl(nav); 565 var panel = new OpenLayers.Control.Panel( 566 { 567 defaultControl : pan, 568 displayClass : "olToolbar", 569 "div" : OpenLayers.Util.getElement(mapOpts.id + "-olToolbar") 570 }); 571 panel.addControls([ 572 zoomin, zoomout, pan, info, nav.next, nav.previous 573 ]); 574 m.addControl(panel); 575 } else { 576 OpenLayers.Util.getElement(mapOpts.id + '-olToolbar').display = 'none'; 577 } 578 579 if (OLmapPOI.length > 0) { 580 var markers = 581 new OpenLayers.Layer.Vector( 582 "POI", 583 { 584 styleMap : new OpenLayers.StyleMap( 585 { 586 "default" : { 587 externalGraphic : "${img}", 588 graphicHeight : 16, 589 graphicWidth : 16, 590 graphicXOffset : 0, 591 graphicYOffset : -8, 592 graphicOpacity : "${opacity}", 593 rotation : "${angle}", 594 backgroundGraphic : DocBase 595 + "lib/plugins/openlayersmap/icons/marker_shadow.png", 596 backgroundXOffset : 0, 597 backgroundYOffset : -4, 598 backgroundRotation : "${angle}", 599 pointRadius : 10, 600 labelXOffset : 8, 601 labelYOffset : 8, 602 labelAlign : "lb", 603 label : "${label}", 604 // fontColor : "", 605 fontFamily : "monospace", 606 fontSize : "12px", 607 fontWeight : "bold" 608 }, 609 "select" : { 610 cursor : "crosshair", 611 externalGraphic : DocBase 612 + "lib/plugins/openlayersmap/icons/marker-red.png", 613 graphicHeight : 16, 614 graphicWidth : 16, 615 graphicXOffset : 0, 616 graphicYOffset : -8, 617 graphicOpacity : 1.0, 618 rotation : "${angle}" 619 } 620 }), 621 isBaseLayer : !1, 622 rendererOptions : { 623 yOrdering : !0 624 } 625 }); 626 m.addLayer(markers); 627 var features = []; 628 var lonLat; 629 for ( var j = 0; j < OLmapPOI.length; j++) { 630 var feat = new OpenLayers.Feature.Vector( 631 new OpenLayers.Geometry.Point( 632 OLmapPOI[j].lon, OLmapPOI[j].lat).transform( 633 m.displayProjection, m.projection), { 634 angle : OLmapPOI[j].angle, 635 opacity : OLmapPOI[j].opacity, 636 img : DocBase + "lib/plugins/openlayersmap/icons/" + OLmapPOI[j].img, 637 label : OLmapPOI[j].rowId 638 }); 639 feat.data = { 640 name : OLmapPOI[j].txt, 641 rowId : OLmapPOI[j].rowId 642 }; 643 features.push(feat); 644 } 645 markers.addFeatures(features); 646 extent.extend(markers.getDataExtent()); 647 m.zoomToExtent(extent); 648 } 649 650 /* 651 * map.addLayer(new OpenLayers.Layer.Vector("GML", { protocol: new 652 * OpenLayers.Protocol.HTTP({ url: "gml/polygon.xml", format: new 653 * OpenLayers.Format.GML() }), strategies: [new OpenLayers.Strategy.Fixed()] 654 * })); 655 */ 656 657 /* GPX layer */ 658 if (mapOpts.gpxfile.length > 0) { 659 var layerGPX = new OpenLayers.Layer.Vector( 660 "GPS route", { 661 protocol : new OpenLayers.Protocol.HTTP( 662 { 663 url : DocBase + "lib/exe/fetch.php?media=" + mapOpts.gpxfile, 664 format : new OpenLayers.Format.GPX( 665 { 666 extractWaypoints : !0, 667 extractTracks : !0, 668 extractStyles : !0, 669 extractAttributes : !0, 670 handleHeight : !0, 671 maxDepth : 3 672 }) 673 }), 674 style : { 675 strokeColor : "#0000FF", 676 strokeWidth : 3, 677 strokeOpacity : 0.7, 678 pointRadius : 4, 679 fillColor : "#0099FF", 680 fillOpacity : 0.7 681 // , label:"${name}" 682 }, 683 projection : new OpenLayers.Projection( 684 "EPSG:4326"), 685 strategies : [ 686 new OpenLayers.Strategy.Fixed() 687 ] 688 }); 689 m.addLayer(layerGPX); 690 layerGPX.events.register( 691 'loadend', m, function() { 692 extent.extend(layerGPX.getDataExtent()); 693 m.zoomToExtent(extent); 694 }); 695 696 } 697 698 /* KML layer */ 699 if (mapOpts.kmlfile.length > 0) { 700 var layerKML = new OpenLayers.Layer.Vector( 701 "KML file", { 702 protocol : new OpenLayers.Protocol.HTTP( 703 { 704 url : DocBase + "lib/exe/fetch.php?media=" + mapOpts.kmlfile, 705 format : new OpenLayers.Format.KML( 706 { 707 extractStyles : !0, 708 extractAttributes : !0, 709 maxDepth : 3 710 }) 711 }), 712 style : { 713 label : "${name}" 714 }, 715 projection : new OpenLayers.Projection( 716 "EPSG:4326"), 717 strategies : [ 718 new OpenLayers.Strategy.Fixed() 719 ] 720 }); 721 m.addLayer(layerKML); 722 layerKML.events.register( 723 'loadend', m, function() { 724 extent.extend(layerKML.getDataExtent()); 725 m.zoomToExtent(extent); 726 }); 727 } 728 729 // selectcontrol for layers 730 if ((m.getLayersByClass('OpenLayers.Layer.GML').length > 0) 731 || m.getLayersByClass('OpenLayers.Layer.Vector').length > 0) { 732 selectControl = 733 new OpenLayers.Control.SelectFeature( 734 (m.getLayersByClass('OpenLayers.Layer.Vector')).concat(m 735 .getLayersByClass('OpenLayers.Layer.GML')), { 736 hover : mapOpts.poihoverstyle, 737 onSelect : onFeatureSelect, 738 onUnselect : onFeatureUnselect 739 }); 740 m.addControl(selectControl); 741 selectControl.activate(); 742 } 743 return m; 744} 745 746var olTimerId = -1; 747 748/** init. */ 749function olInit() { 750 if (navigator.userAgent.indexOf('MSIE') !== -1) { 751 // console.log("need to sleep"); 752 if (olTimerId === -1) { 753 olTimerId = setTimeout( 754 "olInit()", 3000); 755 olEnable = !1; 756 } else { 757 // console.log("done sleeping"); 758 clearTimeout(olTimerId); 759 olEnable = !0; 760 } 761 } 762 763 if (olEnable) { 764 var _i = 0; 765 // create the maps in the page 766 for (_i = 0; _i < olMapData.length; _i++) { 767 // console.log(olMapData); 768 createMap( 769 olMapData[_i].mapOpts, olMapData[_i].poi); 770 } 771 772 // hide the table(s) with POI by giving it a print-only style 773 // var tbls = getElementsByClass('olPOItableSpan', null, null); 774 var tbls = jQuery('.olPOItableSpan'); 775 for (_i = 0; _i < tbls.length; _i++) { 776 tbls[_i].className += ' olPrintOnly'; 777 } 778 // hide the static map image(s) by giving it a print only style 779 // var statImgs = getElementsByClass('olStaticMap', null, null); 780 var statImgs = jQuery('.olStaticMap'); 781 for (_i = 0; _i < statImgs.length; _i++) { 782 statImgs[_i].className += ' olPrintOnly'; 783 } 784 } 785} 786 787/** 788 * ol api flag. 789 * 790 * @type {Boolean} 791 */ 792var olEnable = !1, 793/** 794 * array with data for each map in the page. 795 * 796 * @type {Array} 797 */ 798olMapData = [], 799/** 800 * MapQuest tiles flag. 801 * 802 * @type {Boolean} 803 */ 804mqEnable = !1, 805/** 806 * google map api flag. 807 * 808 * @type {Boolean} 809 */ 810gEnable = !1, 811/** 812 * virtual earth map api flag. 813 * 814 * @type {Boolean} 815 */ 816veEnable = !1, 817/** 818 * Bing tiles flag. 819 * 820 * @type {Boolean} 821 */ 822bEnable = !1, 823/** 824 * Bing API key. 825 * 826 * @type {String} 827 */ 828bApiKey = '', 829/** 830 * OSM tiles flag. 831 * 832 * @type {Boolean} 833 */ 834osmEnable = !0, 835/** 836 * CSS support flag. 837 * 838 * @type {Boolean} 839 */ 840olCSSEnable = !0; 841/** 842 * yahoo map api flag. 843 * 844 * @type {Boolean} 845 */ 846// yEnable = false; 847/* register olInit to run with onload event. */ 848// addInitEvent(olInit); 849jQuery(olInit); 850
