OpenLayers 4 - 绘制矩形

Question

我只想在风格中绘制矩形。

如果我这样做

 image: new ol.style.RegularShape({
            fill: fill,
            //stroke: stroke,
            // offsetY: -25,
            points: 4,
            radius1: 30,
            //radius2:20,
            angle: Math.PI / 4
        })

它给了我这个

否则如果我这样做

 image: new ol.style.RegularShape({
            fill: fill,
            //stroke: stroke,
            // offsetY: -25,
            points: 4,
            radius1: 30,
            radius2:10,
            angle: Math.PI / 4
        })

它给了我这个

如何绘制矩形？

Answer 1

您无法使用ol.style.RegularShape绘制矩形，因为矩形不是常规形状。相反，您可以将ol.style.Icon与自定义画布一起使用：

var canvas = document.createElement('canvas');
canvas.width = 60;
canvas.height = 20;
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'red';
ctx.fillRect(0, 0, canvas.width, canvas.height);;

var imageStyle = new ol.style.Icon({
  img: canvas,
  imgSize: [60, 20]
});