diff --git a/src/style/drawstyles.js b/src/style/drawstyles.js index 024b43071..7e3ef4e1c 100644 --- a/src/style/drawstyles.js +++ b/src/style/drawstyles.js @@ -1,6 +1,7 @@ import { Circle as CircleStyle, Fill, + Icon, RegularShape, Stroke, Style, @@ -9,8 +10,15 @@ import { import { getArea, getLength } from 'ol/sphere'; import { LineString, MultiPoint, Point } from 'ol/geom'; -function createRegularShape(type, size, fill, stroke) { +function createRegularShape(type, pointSize, pointFill, pointStroke) { let style; + const size = pointSize || 10; + const stroke = pointStroke || new Stroke({ + color: 'rgba(0, 0, 0, 0.7)' + }); + const fill = pointFill || new Fill({ + color: 'rgba(0, 153, 255, 0.8)' + }); switch (type) { case 'square': style = new Style({ @@ -86,6 +94,29 @@ function createRegularShape(type, size, fill, stroke) { }); break; + case 'marker': { + let fillColor = 'blue'; + let strokeColor = 'black'; + let strokeWidth = 10; + if (fill && fill.getColor) { + fillColor = encodeURIComponent(fill.getColor()); + } + if (stroke && stroke.getColor) { + strokeColor = encodeURIComponent(stroke.getColor()); + } + if (stroke && stroke.getWidth) { + strokeWidth = 5 * stroke.getWidth(); + } + const svg = ``; + style = new Style({ + image: new Icon({ + src: `data:image/svg+xml;utf8,${svg}`, + scale: size / 10 || 1, + anchor: [0.5, 0.85] + }) + }); + break; + } default: style = new Style({ image: new CircleStyle({ diff --git a/src/style/styletemplate.js b/src/style/styletemplate.js index 785dc19ed..81846e257 100644 --- a/src/style/styletemplate.js +++ b/src/style/styletemplate.js @@ -74,6 +74,7 @@ export default function styleTemplate(palette, swStyle) { + `;