Show an example of changing the color with setfill
This commit is contained in:
@@ -12,3 +12,6 @@ docs: >
|
||||
tags: "vector, symbol, regularshape, style, square, rectangle, cross, star, triangle, x"
|
||||
---
|
||||
<div id="map" class="map"></div>
|
||||
<div>
|
||||
<button id="color-changer">Change Square Colors</button>
|
||||
</div>
|
||||
|
||||
@@ -129,3 +129,14 @@ const map = new Map({
|
||||
zoom: 2,
|
||||
}),
|
||||
});
|
||||
|
||||
const colors = ['blue', 'green', 'yellow', 'aqua', 'red'];
|
||||
let currentColor = 0;
|
||||
|
||||
document.getElementById('color-changer').addEventListener('click', function () {
|
||||
styles.square
|
||||
.getImage()
|
||||
.setFill(new Fill({color: colors[currentColor % colors.length]}));
|
||||
vectorLayer.changed();
|
||||
currentColor++;
|
||||
});
|
||||
|
||||
@@ -207,6 +207,7 @@ class RegularShape extends ImageStyle {
|
||||
*/
|
||||
setFill(fill) {
|
||||
this.fill_ = fill;
|
||||
this.render();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -325,6 +326,7 @@ class RegularShape extends ImageStyle {
|
||||
*/
|
||||
setStroke(stroke) {
|
||||
this.stroke_ = stroke;
|
||||
this.render();
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user