select control select with feature.geometry.intersects item on startup
by Thomas B.
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/openlayers/2.11/OpenLayers.js"></script>
<body onload="init()">
<div id="map"></div>
</body>
CSS
#map {
width: 600px;
height: 600px;
}
JavaScript
var apiKey = "AqTGBsziZHIJYYxgivLBf0hVdrAk9mWO5cQcb8Yux8sW5M8c8opEC2lZqKR1ZZXf";
var lon = 35.251758;
var lat = 31.544518;
var map, vlayer, selectFeature;
function init() {
map = new OpenLayers.Map('map', {
});
var road = new OpenLayers.Layer.Bing({
key: apiKey,
type: "Road",
metadataParams: {
mapVersion: "v1"
}
});
map.addLayers([road]);
vlayer = new OpenLayers.Layer.Vector("Editable");
map.addLayer(vlayer);
var zoom = 8;
map.setCenter(new OpenLayers.LonLat(lon, lat).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()), zoom);
selectControl = new OpenLayers.Control.SelectFeature(vlayer, {
onSelect: onFeatureSelect,
onUnselect: onFeatureUnselect
});
map.addControl(selectControl);
selectControl.activate();
loadPointsfromGeojson();
select();
}
function onPopupClose(evt) {
selectControl.unselect(selectedFeature);
}
function onFeatureSelect(feature) {
selectedFeature = feature;
popup = new OpenLayers.Popup.FramedCloud("chicken",
feature.geometry.getBounds().getCenterLonLat(),
new OpenLayers.Size(300, 300),
"<h6>Name: <br />" + feature.attributes.name + "</h6>",
null, true, onPopupClose);
feature.popup = popup;
//map.addPopup(popup);
map.addPopup(popup, true);
}
function onFeatureUnselect(feature) {
map.removePopup(feature.popup);
feature.popup.destroy();
feature.popup = null;
}
function loadPointsfromGeojson() {
var featurecollection = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"id": "PSE",
"properties": {
"name": "West Bank"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
35.545665,
...