1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
|
/* layers */
var default_pointer = "../media/images/default-pointer.png";
var view_projection = 'EPSG:3857';
var map_default_center = 'SRID=4326;POINT (2.4397 46.5528)';
var map_default_zoom = '7';
var source_osm = function(options){
return new ol.layer.Tile({
source: new ol.source.OSM()
});
};
var default_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(
default_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 center;
var map;
var map_view;
var map_layers;
var proj_options = {
dataProjection:'EPSG:4326', featureProjection: view_projection
}
var geojson_format = new ol.format.GeoJSON(proj_options);
var wkt_format = new ol.format.WKT(proj_options);
var initialize_map = function(map_id, layers){
center = wkt_format.readGeometry(map_default_center).getCoordinates();
/*
vector_source = new ol.source.Vector({
features: geojson_format.readFeatures(points)
});
*/
vector_source = new ol.source.Vector();
vector_layer = new ol.layer.Vector({
source: vector_source,
style: get_style
});
map_layers = get_layers(layers);
map_layers.push(vector_layer);
map_view = new ol.View({
projection: view_projection,
center: ol.proj.fromLonLat([center[0], center[1]]),
zoom: map_default_zoom
});
map = new ol.Map({
target: map_id,
layers: map_layers,
view: map_view
});
}
var redraw_map = function(map_id, layers){
map.setTarget(null);
map = null;
initialize_map(map_id, layers);
};
var display_map = function(map_id, points, layers){
if (map){
redraw_map(map_id, layers);
} else {
initialize_map(map_id, layers);
}
vector_source.clear();
vector_source.addFeatures(geojson_format.readFeatures(points));
map.updateSize();
if (points.features.length){
map_view.fit(vector_source.getExtent());
if (map_view.getZoom() > 12){
map_view.setZoom(12);
}
}
}
|
