Question

我正在使用Ol 4.6.5并且我有一个错误：

 const geoVector = new ol.source.Vector({
  features: new ol.format.GeoJSON().readFeatures(geoJSON)
});

const tilesStyle = new ol.style.Style({
  zIndex: -1,
  stroke: new ol.style.Stroke({
    color: "rgb(53,198,234, 0.8)",
    width: 6
  })
});

this.panoramasTracksLayer = new ol.layer.Vector({
  source: geoVector,
  style: tilesStyle
});
map.addLayer(this.panoramasTracksLayer);

这里我从服务器

获取GEOJSON层

  feature = new ol.Feature(new ol.geom.Point(ol.proj.fromLonLat(point as any)));
  feature.setStyle([
    new ol.style.Style({
      zIndex: 15,
      image: new ol.style.Circle({
        radius: 20,
        stroke: new ol.style.Stroke({
          color: "#fff",
          width: 2
        }),
        fill: new ol.style.Fill({
          color: "rgb(53,198,234)"
        })
      })
    }),
    new ol.style.Style({
      zIndex: 16,
      text: new ol.style.Text({
        text: "\u27A4",
        textAlign: "center",
        textBaseline: "middle",
        font: "bold 24px",
        scale: 2.7,
        rotateWithView: true,
        rotation: -1.6 + pRotation,
        fill: new ol.style.Fill({
          color: "#111"
        })
      })
    })
  ]);
  source.addFeature(feature);

上面我在地图上添加了一个功能。为什么openLayers正在绘制我的全景图跟踪我的功能？以及如何解决这个问题？

Answer 1

您可以在图层本身设置Z-index

this.panoramasTracksLayer = new ol.layer.Vector({
  source: geoVector,
  style: tilesStyle,
  zIndex: -1
});

为什么Openlayers z-Index不会将zIndex 16放在zIndex -1上

1 个答案: