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 
     }) 

をすれば、それは私にこの

を与えてくれそうでなければ、この

を与えます0

どのように矩形を描くことができますか？

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] 
});