Skip to content Skip to sidebar Skip to footer

Openlayers Apply Old Feature Style

I am trying to show or hide features on click. I have many points with different colors, I am trying to change opacity to 0/1. What I managed to do is set 2 different feature style

Solution 1:

I had to declare variable outside function, store the old styles in a list, then loop through the list and apply old styles for each feature.

Hope the code helps someone else.

var clone = [];
      var brojTocaka = 0;
      var i = 0;
      window.onclick = (e) => {
        if (
          e.target.className === "menu-selector2" ||
          e.target.className === "menu-selector"
        )
          $("#" + e.target.id).toggleClass("menu-selector menu-selector2");

        var t = e.target.innerText || e.target.textContent;

        selectedLayer
          .getSource()
          .forEachFeatureInExtent(extent, function (feature) {
            if (
              Object.values(Object.values(feature.get("info"))[0][2])[1] === t
            ) {
              if (e.target.className === "menu-selector2") {
                clone.push(feature.getStyle());
                console.log(clone[brojTocaka]);
                brojTocaka++;
                feature.setStyle(
                  new ol.style.Style({
                    image: new ol.style.Circle({
                      radius: 0,
                      fill: new ol.style.Fill({
                        color: "rgba(0, 0, 0, 0)",
                      }),
                      stroke: new ol.style.Stroke({
                        color: [0, 0, 0, 0],
                        width: 0,
                      }),
                    }),
                  })
                );
              }
              if (e.target.className === "menu-selector") {
                console.log(clone[i]);
                feature.setStyle(clone[i]);
                i++;
              }
            }
          });
      };
    });

Post a Comment for "Openlayers Apply Old Feature Style"