CIMSymbol 线和面

尝试一下在线预览

CIM 线和面符号

此示例显示如何使用线和面 CIMSymbols 渲染 FeatureLayers。CIMSymbols 允许用户为其符号添加更多自定义,使用一个或多个符号图层在图层上创建所需的效果。

此示例使用 CIMLineSymbol 来描绘太浩湖边界,这是一条环绕太浩湖的远足小径。显示太浩湖边界的面是使用 CIMPolygonSymbol 渲染的。有关详细信息,请参阅 CIM 规范

3D SceneViews当前不支持 CIM 线和面符号。此外,目前并非支持 CIM 规范中列出的所有内容。

单击此处了解有关 CIMSymbol 限制的更多信息。

CIMSymbol 实用方法

此示例还演示了如何使用 cimSymbolUtils 类中的方法来获取和设置 CIMSymbol 的不同属性。

工作原理

位于右上角 Expand 微件内的符号控件允许用户更改视图中 CIMPointSymbols 的大小和旋转。当 Slider 值更新时,将当前符号拷贝到一个新符号中,并在新符号上调用 cimSymbolUtils.scaleCIMSymbolTo()  以更新符号的大小(或旋转)以匹配滑块的值。然后,使用新符号更新渲染器。

             
1
2
3
4
5
6
7
8
9
10
11
12
13
sizeSlider.on(["thumb-drag", "thumb-change"], (event) => {
  const value = event.value;
  document.getElementById("size").innerHTML = value;
  // 拷贝当前符号
  const newSymbol = trailheads.renderer.symbol.clone();
  // 使用 CIM util 函数将符号缩放到新大小
  cimSymbolUtils.scaleCIMSymbolTo(newSymbol, value);
  // 将渲染器更新为新符号
  trailheads.renderer = {
    type: "simple",
    symbol: newSymbol
  };
});

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.