侧面板中的要素微件

尝试一下在线预览

此示例类似于要素微件示例，不同之处在于此示例演示了将微件停靠到侧面板中。这在您可能不一定希望或不需要关联要素的信息直接显示在地图中的情况下很有用。它使用要素微件基于 PopupTemplate 显示信息。 PopupTemplate 的内容保存在引用图层中，并利用图表媒体的自定义文本元素。

// Provide graphic and DOM container to a new instance of a Feature widget
const feature = new Feature({
  container:"feature-node",
  graphic: graphic,
  map: view.map,
  spatialReference: view.spatialReference
});

// Listen for the pointer-move event on the View
view.on("pointer-move", (event) => {
  // Perform a hitTest on the View
  view.hitTest(event).then((hitTestResult) => {
    const result = hitTestResult.results[0];
    highlight && highlight.remove();
    // Update the graphic of the Feature widget
    // on pointer-move with the result
    if (result) {
      feature.graphic = result.graphic;
      highlight = layerView.highlight(result.graphic);
    } else {
      feature.graphic = graphic;
    }
  });
});

MapView

Feature

Widget

GeoScene API for JavaScript示例中心

侧面板中的要素微件