/* layers */ var default_pointer = "../media/images/default-pointer.png"; var view_projection = 'EPSG:3857'; var source_osm = function(options){ return new ol.layer.Tile({ source: new ol.source.OSM() }); }; var map_layers = { 'osm': source_osm }; var get_layers = function(layers){ if (!layers){ layers = [{'type': 'osm', 'options': null}]; } var ol_layers = []; for (idx in layers){ var layer_attr = layers[idx]; ol_layers.push( map_layers[layer_attr['type']](layer_attr['options']) ); } return ol_layers; }; /* get markers */ var get_markers = function(points){ }; /* styles */ var get_style = function(feature){ /* properties = feature.getProperties(); var size = [properties.icon_width, properties.icon_height]; var anchor = [properties.icon_offset_x, properties.icon_offset_y]; return new ol.style.Style({ image: new ol.style.Icon({ anchor: [17, 50], anchorXUnits: 'pixels', anchorYUnits: 'pixels', src: default_pointer, size: [35, 50] }) }); */ var image = new ol.style.Circle({ radius: 5, fill: null, stroke: new ol.style.Stroke({color: 'red', width: 1}) }); return new ol.style.Style({ image: image }); }; /* display map */ var vector_source; var vector_layer; var map_layers; var map; var geojson_format = new ol.format.GeoJSON( {dataProjection:'EPSG:4326', featureProjection: view_projection}); var display_map = function(map_id, points, layers){ vector_source = new ol.source.Vector({ features: geojson_format.readFeatures(points) }); vector_layer = new ol.layer.Vector({ source: vector_source, style: get_style }); map_layers = get_layers(layers); map_layers.push(vector_layer); map = new ol.Map({ target: map_id, layers: map_layers, view: new ol.View({ projection: view_projection, center: ol.proj.fromLonLat([37.41, 8.82]), zoom: 4 }) }); }