Mapbox GL JS在图层中的特定要素上设置绘制特性

我使用Mapbox Studio作为映射和样式的基础，然后使用HTML作为其他映射功能

其中一个功能是在悬停或鼠标输入时更改图标的不透明度。我已经检查了其他示例和所有其他引用特性，当您直接在HTML中创建它时。我设法改变不透明度，但只为整个层

我是否可以使用e.features[0]命令行将更改仅应用于一个要素而不是整个图层

我使用了这段代码，整个层的“图标”层包含5个带文本的图标：

    // Change the cursor to a default and change opacity when the it enters a feature in the 'Icons' layer.
map.on('mouseenter', 'Icons', function() {
    map.getCanvas().style.cursor = 'default';
    var feature = e.features[0];
    map.setPaintProperty('Icons', 'icon-opacity', 0.5);
});

// Change it back to a pointer and reset opacity when it leaves.
map.on('mouseleave', 'Icons', function() {
    map.getCanvas().style.cursor = '',
    map.setPaintProperty('Icons', 'icon-opacity', 1);
});

---

谢谢你

有几种方法可以实现这一点。一种方法是将每个要素添加为单独的图层，这样当您想要更改添加在图层“特定图标图层”中的图标的不透明度时，可以将“特定图标图层”传递给Mapon方法。如果标记的数量相对较少，这可能是最简单的选择

另一种方法是向每个图标功能添加唯一的ID，以便可以将过滤器表达式与and或结合使用。例如，假设您为每个GeoJSON功能添加了一个“id”属性，表示“Icons”层源中的一个图标。然后，您可以设置一个类似于的事件侦听器，检索返回功能的“id”，并使用“id”（假设这里是“示例id”）来更新“图标”层的绘制属性：

---

在这里，我们使用和表达式来表示如果功能的“id”是“示例id”，则将其图标绘制为不透明度0.5，否则使用不透明度1。

有几种方法可以实现这一点。一种方法是将每个要素添加为单独的图层，这样当您想要更改添加在图层“特定图标图层”中的图标的不透明度时，可以将“特定图标图层”传递给Mapon方法。如果标记的数量相对较少，这可能是最简单的选择

另一种方法是向每个图标功能添加唯一的ID，以便可以将过滤器表达式与and或结合使用。例如，假设您为每个GeoJSON功能添加了一个“id”属性，表示“Icons”层源中的一个图标。然后，您可以设置一个类似于的事件侦听器，检索返回功能的“id”，并使用“id”（假设这里是“示例id”）来更新“图标”层的绘制属性：

---

在这里，我们使用和表达式来表示如果特征的“id”是“示例id”，则将其图标绘制为不透明度0.5，否则使用不透明度1。

您应该阅读样式规范中的表达式。您可以使用这些来根据特征属性更改显示属性。您应该仔细阅读样式库中的表达式。可以使用这些表达式根据要素属性更改显示特性。

map.setPaintProperty(
  'Icons', 
  'icon-opacity', 
  ['match', ['get', 'id'], 'example-id', 0.5 , 1]
);