Question

如图把绘图区域底色更改为斜线

Answer 1

目前前端的填充样式只支持颜色的风格。

Comments

你说的是ol.style.fill里面的color吗 这个我改了只是画的时候有颜色 画好之后填充颜色还是默认的

---

贴一下完整的代码，看一下是如何实现的。

---

$(buttons[key]).on('click', function () {
            clearInteraction();
            draw = new ol.interaction.Draw({
                source: source,
                type: buttons[key].value,
                snapTolerance: 20,
                freehand: true,
                style: new ol.style.Style({  //就这里面设置的颜色吧 只有绘的时候有颜色 绘玩颜色就又是白色了
                    
                    fill: new ol.style.Fill({
                        color:'rgba(0,0,0,0.5)',
                    })
                })
            });
            map.addInteraction(draw);
        });

---

你这个fill是对于绘制时候对绘制的面设置了样式，可以对他的绘制结果的目标源或者目标features设置样式

---

我看的别的也是改features  但是我不会获取绘图

---

https://openlayers.org/en/latest/apidoc/module-ol_layer_Vector-VectorLayer.html

你可以new 一个vectorlayer，然后把你生成的这个目标source，就是我上图里画红圈的，传给这个vectorlayer，然后设置这个vectorlayer的style

---

看不太懂 不会指过去

         $(buttons[key]).on('click', function () {
            clearInteraction();
            draw = new ol.interaction.Draw({
                source: source,
                layers: [
                    vectorLayer
                ],
                type: buttons[key].value,
                snapTolerance: 20,
                freehand: true
            });
            var vectorLayer = new ol.layer.Vector({
                source: source,
                style:new ol.style.Style({
                    fill:new ol.style.Fill({
                        color:'rgba(0,0,0,0.9)'
                    })
                })
            });
            map.addInteraction(draw);
        });
    });

---

https://openlayers.org/en/latest/examples/draw-features.html

可以参考下openlayers的示例，这个有绘制并保存到vectorlayer的功能，设置vectorlayer的样式就可以了

---

谢谢 终于改出来了

---

大佬，弱弱的问一下，Leeaflet能实现反斜线填充吗，被困扰好久了