1 | goog.require('ol.Feature');
|
2 | goog.require('ol.Map');
|
3 | goog.require('ol.View');
|
4 | goog.require('ol.geom.Point');
|
5 | goog.require('ol.layer.Vector');
|
6 | goog.require('ol.source.Vector');
|
7 | goog.require('ol.style.Fill');
|
8 | goog.require('ol.style.RegularShape');
|
9 | goog.require('ol.style.Stroke');
|
10 | goog.require('ol.style.Style');
|
11 |
|
12 |
|
13 | var stroke = new ol.style.Stroke({color: 'black', width: 2});
|
14 | var fill = new ol.style.Fill({color: 'red'});
|
15 |
|
16 | var styles = {
|
17 | 'square': new ol.style.Style({
|
18 | image: new ol.style.RegularShape({
|
19 | fill: fill,
|
20 | stroke: stroke,
|
21 | points: 4,
|
22 | radius: 10,
|
23 | angle: Math.PI / 4
|
24 | })
|
25 | }),
|
26 | 'triangle': new ol.style.Style({
|
27 | image: new ol.style.RegularShape({
|
28 | fill: fill,
|
29 | stroke: stroke,
|
30 | points: 3,
|
31 | radius: 10,
|
32 | rotation: Math.PI / 4,
|
33 | angle: 0
|
34 | })
|
35 | }),
|
36 | 'star': new ol.style.Style({
|
37 | image: new ol.style.RegularShape({
|
38 | fill: fill,
|
39 | stroke: stroke,
|
40 | points: 5,
|
41 | radius: 10,
|
42 | radius2: 4,
|
43 | angle: 0
|
44 | })
|
45 | }),
|
46 | 'cross': new ol.style.Style({
|
47 | image: new ol.style.RegularShape({
|
48 | fill: fill,
|
49 | stroke: stroke,
|
50 | points: 4,
|
51 | radius: 10,
|
52 | radius2: 0,
|
53 | angle: 0
|
54 | })
|
55 | }),
|
56 | 'x': new ol.style.Style({
|
57 | image: new ol.style.RegularShape({
|
58 | fill: fill,
|
59 | stroke: stroke,
|
60 | points: 4,
|
61 | radius: 10,
|
62 | radius2: 0,
|
63 | angle: Math.PI / 4
|
64 | })
|
65 | })
|
66 | };
|
67 |
|
68 |
|
69 | var styleKeys = ['x', 'cross', 'star', 'triangle', 'square'];
|
70 | var count = 250;
|
71 | var features = new Array(count);
|
72 | var e = 4500000;
|
73 | for (var i = 0; i < count; ++i) {
|
74 | var coordinates = [2 * e * Math.random() - e, 2 * e * Math.random() - e];
|
75 | features[i] = new ol.Feature(new ol.geom.Point(coordinates));
|
76 | features[i].setStyle(styles[styleKeys[Math.floor(Math.random() * 5)]]);
|
77 | }
|
78 |
|
79 | var source = new ol.source.Vector({
|
80 | features: features
|
81 | });
|
82 |
|
83 | var vectorLayer = new ol.layer.Vector({
|
84 | source: source
|
85 | });
|
86 |
|
87 | var map = new ol.Map({
|
88 | layers: [
|
89 | vectorLayer
|
90 | ],
|
91 | target: 'map',
|
92 | view: new ol.View({
|
93 | center: [0, 0],
|
94 | zoom: 2
|
95 | })
|
96 | });
|