OpenLayers Stylemap Style Context vectorlayer
HTML
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<h2>OpenLayers Vector dynamic Style with context function </h2>
<div id="map"></div>
CSS
@import url(http://fonts.googleapis.com/css?family=Oswald:400, 700, 300);
html, body {
font-family:'Oswald', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 12px;
color: #2F8CEA;
width:100%;
height:100%;
}
#map {
width:97%;
height:87%;
border:1px solid #2F8CEA;
margin: auto;
}
JavaScript
(function () {
var map, layer;
map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.OSM("Simple OSM Map");
map.addLayer(layer);
map.setCenter(
new OpenLayers.LonLat(-1.1240386962890625,
44.68500966685889).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()), 11);
var featurecollection = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"marker-color": "#7e7e7e",
"marker-size": "medium",
"marker-symbol": "",
"id": 1
},
"geometry": {
"type": "markers",
"coordinates": [-1.1789703369140625,
44.698677475225224]
}
}, {
"type": "Feature",
"properties": {
"marker-color": "#7e7e7e",
"marker-size": "medium",
"marker-symbol": "",
"id": 2
},
"geometry": {
"type": "Point",
"coordinates": [-1.0200119018554688,
44.687206496456966]
}
}, {
"type": "Feature",
"properties": {
"marker-color": "#7e7e7e",
"marker-size": "medium",
"marker-symbol": "",
"id": 3
},
"geometry": {
"type": "Point",
"coordinates": [-1.251068115234375,
44.62981752172151]
}
}]
};
var geojson_format = new OpenLayers.Format.GeoJSON({
'internalProjection': new OpenLayers.Projection("EPSG:900913"),
'externalProjection': new OpenLayers.Projection("EPSG:4326")
});
var your_context = {
getColor: function (feature) {
if...