主页 / 问题 / 1139514
Accepted
all_possible
Asked:2020-06-11 14:09:36 +0000 UTC2020-06-11 14:09:36 +0000 UTC

透明物体相互叠加完全屏蔽时合并透明物体

  • 772

我在地图上显示了很多标签，我使用标签圆（Circle）的几何形状。标签是透明的。当穿过几个标记时，它们会相互重叠，在某些时候它们会变得完全不透明。

标签是使用 geoQuery 从 json 视图派生的（由于某种原因，我不能使用 ObjectManager）。

我需要确保在交叉标记时它们不会重叠，但如果它们具有相同的颜色，它们会以某种方式相互融合。但是我有不同颜色的标签，如果不同颜色的标签相交，需要一种颜色与另一种颜色重叠（例如，有一个蓝色和红色的标签，这样红色的相交部分蓝色根本不可见，只有蓝色可见，其余的红色（不与任何东西相交）可见）。

我需要的一个理想示例： https ://geo.minsvyaz.ru

请告诉我如何实施

yandex-maps-api

1 个回答

  1. Best Answer

    如有必要，如理想示例所示，您将需要：

    1. 在“区域”上方添加可移动的半透明涂料。
    2. 使用必要的 zIndex 参数将所有圆形添加到创建的油漆中，笔画为零，严格不透明。

    然后它们将完全重叠，生成的图层将是透明的。

    如果稍后需要透明覆盖，则可以添加额外的此类油漆并在创建的油漆之间分配对象。

    var newPane = new ymaps.pane.MovablePane(myMap, {zIndex: 210, overflow: 'hidden', css:{opacity: 0.5}});
myMap.panes.append("circlePane", newPane);

myMap.geoObjects.options.set({'fillOpacity': 3, 'strokeWidth': 0, 'pane': 'circlePane'});

var myCircle1 = new ymaps.Circle([[55.76, 37.60], 10000], {}, {
    fillColor: "#FF0000",
    zIndex: 1
}),
myCircle2 = new ymaps.Circle([[55.76, 37.80], 10000], {}, {
    fillColor: "#0000FF",
    zIndex: 0
});

myMap.geoObjects.add(myCircle1).add(myCircle2);

    在 jsfiddle 上的实现：https ://jsfiddle.net/Coroner1st/ym1v5qbt/7/

    • 1

相关问题