在mapbox中，如何将要素移动到顶部（z索引方向）？

我有一个充满国家边界“特征”的图层。当用户单击某个状态时，我希望将该状态的功能移动到堆栈的顶部（z索引）

当我选择状态时

export function stateSelected(state) {
  const stateFeatures = this.map.queryRenderedFeatures({
    layers: ['state-borders'],
    filter: [
      '==', 'STATE_NAME', state,
    ],
  });

  const features = this.stateGeoJSON.features;
  const currentFeature = stateFeatures[0];

  if (!currentFeature) {
    return;
  }

  // same state
  if (currentFeature.id === this.selectedStateId) return;

  // move to front HERE ?????

  // old selected state
  if (this.selectedStateId) {
    this.map.setFeatureState({
      source: 'states',
      id: this.selectedStateId,
    }, {
      selected: false,
    });
  }

  this.selectedStateId = currentFeature.id;

  this.map.setFeatureState({
    source: 'states',
    id: this.selectedStateId,
  }, {
    selected: true,
  });
}

到目前为止我已经试过了

  features.splice(features.indexOf(currentFeature), 1);
  features.push(currentFeature);
  this.map.getSource('states').setData(this.stateGeoJSON);

---

这似乎对数组做了一些非常疯狂的事情（复制一些状态，删除其他状态）。不知道发生了什么

将状态添加到另一层起作用（感谢@andrewhavey的建议）

如果有人感兴趣，这里是我的代码

export function stateSelected(state) {
  const features = this.stateGeoJSON.features;
  const currentFeature = features.find(s => s.properties.NAME === state);

  if (!currentFeature) {
    return;
  }

  // removes active layer
  this.removeLayersContaining('state-borders-active');
  this.drawActiveStateLayer(currentFeature);
}


export function drawActiveStateLayer(feature) {
  this.map
    .addLayer({
      id: 'state-borders-active',
      type: 'line',
      source: {
        type: 'geojson',
        data: feature
      },
      paint: {
        'line-color': '#8d8b76',
        'line-width': 6,
      },
    });
}

export function drawStateBorders() {
  $.getJSON('states.json').then((data) => {

    this.stateGeoJSON = data;

    this.map
      .addSource('states', {
        type: 'geojson',
        data,
      })
      .addLayer({
        id: 'state-borders',
        type: 'line',
        source: 'states',
        paint: {
          'line-color': '#bfe2ab',
          'line-width':  3,
        },
      });
  });

---

这也是我正在使用的形状文件：

将特征移动到顶部的新层怎么样？这是个好主意……我会试试看

export function stateSelected(state) {
  const features = this.stateGeoJSON.features;
  const currentFeature = features.find(s => s.properties.NAME === state);

  if (!currentFeature) {
    return;
  }

  // removes active layer
  this.removeLayersContaining('state-borders-active');
  this.drawActiveStateLayer(currentFeature);
}


export function drawActiveStateLayer(feature) {
  this.map
    .addLayer({
      id: 'state-borders-active',
      type: 'line',
      source: {
        type: 'geojson',
        data: feature
      },
      paint: {
        'line-color': '#8d8b76',
        'line-width': 6,
      },
    });
}

export function drawStateBorders() {
  $.getJSON('states.json').then((data) => {

    this.stateGeoJSON = data;

    this.map
      .addSource('states', {
        type: 'geojson',
        data,
      })
      .addLayer({
        id: 'state-borders',
        type: 'line',
        source: 'states',
        paint: {
          'line-color': '#bfe2ab',
          'line-width':  3,
        },
      });
  });