https://www.boos.org/wp-content/themes/eurogoos/library/js/map.js

1/*
2Map
3Author: Blue Lobster IT Limited
4*/
5
6var map, layer;
7
8// as the page loads, call these scripts
9jQuery(document).ready(function($) {
10
11    //var lon = 1;
12    //var lat = 55.55;
13    var lon = 20;
14    var lat = 58;
15    var zoom = 2.88,
16    epsg4326 = new OpenLayers.Projection('EPSG:4326'),
17    epsg900913 = new OpenLayers.Projection('EPSG:900913');
18
19    map = new OpenLayers.Map( 'partner_map', {
20        //controls: [],
21        fractionalZoom: true
22    } );
23    layer = new OpenLayers.Layer.XYZ( "OpenLayers XYZ",
24                                      "/tileserver/BOOS.mbtiles/${z}/${x}/${y}.png?id=123", {
25                                          sphericalMercator:true, layers:'basic',
26        resolutions: [156543.03390625, 78271.516953125, 39135.7584765625,
27                      19567.87923828125, 9783.939619140625, 4891.9698095703125,
28                      2445.9849047851562, 1222.9924523925781, 611.4962261962891,
29                      305.74811309814453, 152.87405654907226, 76.43702827453613,
30                      38.218514137268066, 19.109257068634033, 9.554628534317017,
31                      4.777314267158508, 2.388657133579254, 1.194328566789627,
32                      0.5971642833948135, 0.25, 0.1, 0.05],
33        serverResolutions: [156543.03390625, 78271.516953125, 39135.7584765625,
34                            19567.87923828125, 9783.939619140625,
35                            4891.9698095703125, 2445.9849047851562,
36                            1222.9924523925781, 611.4962261962891,
37                            305.74811309814453, 152.87405654907226,
38                            76.43702827453613, 38.218514137268066,
39                            19.109257068634033, 9.554628534317017,
40                            4.777314267158508, 2.388657133579254,
41                            1.194328566789627, 0.5971642833948135],
42        transitionEffect: 'resize'
43                                      });
44    map.addLayer(layer);
45
46    map.setCenter(new OpenLayers.LonLat(lon, lat).transform(
47        'EPSG:4326', 'EPSG:900913'
48    ), zoom);
49    //map.addControl( new OpenLayers.Control.LayerSwitcher() );
50
51var strategy = new OpenLayers.Strategy.Cluster({
52    distance: 1 // <-- removed clustering flag
53});
54
55    members_layer = new OpenLayers.Layer.Vector("GeoJSON", {
56        projection: epsg4326,
57        strategies: [new OpenLayers.Strategy.Fixed(),strategy],
58        protocol: new OpenLayers.Protocol.HTTP({
59            url: ajax_object.ajax_url + "?action=members_geojson",
60            format: new OpenLayers.Format.GeoJSON()
61        }),
62        style: {
63            externalGraphic: '/wp-content/themes/eurogoos/library/images/members.png',
64            graphicWidth: 10,
65            graphicHeight: 13,
66            graphicYOffset: -13,
67            cursor: "pointer"
68        },
69        eventListeners:{
70            'featureselected':function(evt){
71                var feature = evt.feature;
72                var popup_content = "";
73                for(var i = 0;i < feature.cluster.length; i++){
74                    var fea = feature.cluster[i];
75                    popup_content += "<div style='font-size:.8em; padding: 5px;'>" + fea.data.name +"</div>";
76                }
77
78                var popup = new OpenLayers.Popup.Anchored ("popup",
79                                                             OpenLayers.LonLat.fromString(feature.geometry.toShortString()),
80                                                             new OpenLayers.Size(175,71),
81                                                             popup_content,
82                                                             null,
83                                                             false
84                                                            );
85                feature.popup = popup;
86                popup.autoSize = true;
87                popup.setBorder("1px solid white");
88                map.addPopup(popup);
89
90                jQuery(".olPopup").css("z-index", 10000);
91            },
92            'featureunselected':function(evt){
93                var feature = evt.feature;
94                map.removePopup(feature.popup);
95                feature.popup.destroy();
96                feature.popup = null;
97            }
98        }
99    });
100
101    map.addLayer (members_layer);
102
103    ooss_layer = new OpenLayers.Layer.Vector("GeoJSON", {
104        projection: epsg4326,
105        strategies: [new OpenLayers.Strategy.Fixed()],
106        protocol: new OpenLayers.Protocol.HTTP({
107            url: ajax_object.ajax_url + "?action=ooss_geojson",
108            format: new OpenLayers.Format.GeoJSON()
109        }),
110        style: {
111            externalGraphic: '/wp-content/themes/eurogoos/library/images/regional_systems.png',
112            graphicWidth: 11,
113            graphicHeight: 15,
114            graphicYOffset: -15,
115            cursor: "pointer"
116        },
117        eventListeners:{
118            'featureselected':function(evt){
119                var feature = evt.feature;
120                var popup = new OpenLayers.Popup.Anchored ("popup",
121                                                             OpenLayers.LonLat.fromString(feature.geometry.toShortString()),
122                                                             new OpenLayers.Size(175,91),
123                                                             "<div style='font-size:.8em; padding: 5px;'>" + feature.data.name +"</div>",
124                                                             null,
125                                                             false
126                                                            );
127                feature.popup = popup;
128                popup.autoSize = true;

129                popup.setBorder("1px solid white");
130                map.addPopup(popup);
131
132                jQuery(".olPopup").css("z-index", 10000);
133            },
134            'featureunselected':function(evt){
135                var feature = evt.feature;
136                map.removePopup(feature.popup);
137                feature.popup.destroy();
138                feature.popup = null;
139            }
140        }
141    });
142
143    //map.addLayer (ooss_layer);
144
145    // create the select feature control
146    var selector = new OpenLayers.Control.SelectFeature([members_layer, ooss_layer], {
147        hover:true,
148        autoActivate:true,
149        clickFeature: function (evt) {
150            var link = "";
151            var feature = evt;
152            if(feature.cluster.length == 1){
153                link = feature.cluster[0].data.permalink;
154                window.location = link;
155            }
156
157        }
158    });
159    selector.handlers.feature.stopDown = false;
160
161    map.addControl(selector);
162
163}); /* end of as page load scripts */