FlowRenderer

AMD: require(["geoscene/renderers/FlowRenderer"], (FlowRenderer) => { /* code goes here */ });
ESM: import FlowRenderer from "@geoscene/core/renderers/FlowRenderer";
类: geoscene/renderers/FlowRenderer
继承于:FlowRenderer Accessor
起始版本:GeoScene Maps SDK for JavaScript 4.23

FlowRenderer 允许您使用动画流线来可视化您的栅格数据。此渲染器可用于可视化气象学和海洋学栅格数据中的流向和量级信息。

要使用此渲染器,栅格数据集的源类型必须是 Vector-UVVector-MagDir。栅格的方向定义移动的方向,量级定义流线的可见长度。

流渲染器

已知限制

示例
const renderer = new FlowRenderer({
  density: 1, // visualization will have the maximum amount of streamlines
  color: [50, 120, 240], // blue
  flowSpeed: 10,
  trailWidth: "2px"
});

构造函数

new FlowRenderer(properties)
参数
properties Object
optional

有关可能传递给构造函数的所有属性的列表,请参见属性

示例
let renderer = {
  type: "flow",
  color: [50, 120, 240, 1]
}

属性概述

可以设置、检索或侦听任何属性。请参阅使用属性主题。
显示继承属性 隐藏继承属性
名称 类型 描述
AuthoringInfo

包含有关从 flowRendererCreator.createRenderer() 方法生成的渲染器的元数据,包括用于设置 UI 元素 (如滑块和主题) 的信息。

更多详情
FlowRenderer
Color

动画流线的颜色。

更多详情
FlowRenderer
String

类的名称。

更多详情
Accessor
Number

流线的密度。

更多详情
FlowRenderer
String

定义数据的流向。

更多详情
FlowRenderer
Number

动画流线的速度,相对于模拟时间。

更多详情
FlowRenderer
Object

对象,可提供用于在图例中显示渲染器的选项。

更多详情
FlowRenderer
Number

最大路径长度流线将以点为单位。

更多详情
FlowRenderer
String

流线的前端帽形。

更多详情
FlowRenderer
Number

流线的近似可见长度,以点为单位。

更多详情
FlowRenderer
Number

流线轨迹的宽度,以点为单位。

更多详情
FlowRenderer
String

渲染器的类型。

更多详情
FlowRenderer
VisualVariable[]

VisualVariable 对象的数组。

更多详情
FlowRenderer

属性详细信息

authoringInfo AuthoringInfoautocast

包含有关从 flowRendererCreator.createRenderer() 方法生成的渲染器的元数据,包括用于设置 UI 元素 (如滑块和主题) 的信息。这允许创作客户端保存特定的可覆盖设置,以便用户选择可以在下次通过 UI 访问时被记住。

color Color

动画流线的颜色。

默认值:[255, 255, 255, 1]
declaredClass Stringreadonly inherited

类的名称。声明的类名称格式化为 geoscene.folder.className

density Number

流线的密度。这将确定可视化中出现的线数。可接受的值介于 01 之间。0 值表示不会渲染任何线。1 值将呈现最大的线数。

density = 0.1 density = 0.5 density = 1
密度 0.1 密度 0.5 密度 1
默认值:0.8
flowRepresentation String

定义数据的流向。可对其进行修改以显示气象数据 (流动自) 或气候数据 (流动至)。

描述 示例
flow-from 流动自角度。 flow-from
flow-to 流动至角度。 flow-to

可能值"flow-from"|"flow-to"

默认值:"flow-from"
flowSpeed Number

动画流线的速度,相对于模拟时间。这作为栅格图层的量级的倍数。例如,如果量级为 2ms,flowSpeed 为 10,则流线的实际速度为 20 pts/s。速度为 0 将导致没有动画。

默认值:10
legendOptions Object

对象,可提供用于在图例中显示渲染器的选项。

属性
title String
optional

描述用于驱动可视化的变量。这在 Legend 中显示为相应渲染器的标题。

示例
renderer.legendOptions = {
  title: "Wind speed"
};
maxPathLength Numberautocast
自动转换自 Number|String

最大路径长度流线将以点为单位。根据来自栅格图层的量级或 UV 以及定义的 trailLength,一次只能看到一部分流线。在动画过程中,可见流线将行进到此处定义的路径长度,然后重新开始。此值可以是自动转换的,其字符串以磅或像素表示大小 (例如 100px)。

默认值:200
示例
// width in points
flowRenderer.maxPathLength = 100;
// width in pixels
flowRenderer.maxPathLength = "200px";
// width in points
flowRenderer.maxPathLength = "100pt";
trailCap String
起始版本:GeoScene Maps SDK for JavaScript 4.24

流线的前端帽形。仅当 trailWidth 大于 4px3pt 时,才会使用圆形帽。

可能值"butt"|"round"

默认值:"butt"
trailLength Number

流线的近似可见长度,以点为单位。当 trailLength 是一个较小的数字时,流线会显得很短,因为它们会在达到完整的 maxPathLength 之前开始逐渐消失。

trailLength = 20 trailLength = 100 trailLength = 250
trailLength 20 trailLength 100 trailLength 250
默认值:100
trailWidth Numberautocast
自动转换自 Number|String

流线轨迹的宽度,以点为单位。此值可以是自动转换的,其字符串以磅或像素表示大小 (例如 3px)。

默认值:1.5
示例
// width in points
flowRenderer.trailWidth = 4;
// width in pixels
flowRenderer.trailWidth = "2px";
// width in points
flowRenderer.trailWidth = "4pt";
type Stringreadonly

渲染器的类型。

对于 FlowRenderer,类型总是 "flow"

visualVariables VisualVariable[]autocast
自动转换自 Object[]

VisualVariable 对象的数组。每个对象必须指示要应用的视觉变量类型 (例如 ColorVisualVariable),要从中生成可视化的数值字段,以及要映射到数据的可视化值。以下列表标识了 FlowRenderer 支持的每种视觉变量类型,并提供了每个变量规范表的链接:ColorVisualVariableOpacityVisualVariableSizeVisualVariableSizeVisualVariable 将更新 trailWidth 属性。

为 FlowRenderer 上设置的视觉变量设置字段时,请使用 Magnitude 字段。 Magnitude 将返回第一个波段的像素值。如果数据表示 u (zonal) 和 v (meridional) 速度分量,则值将自动转换为 MagnitudeDirection

另请参阅
示例
const renderer = new FlowRenderer({
   visualVariables: [{
      type: "color",
      field: "Magnitude",
      stops: [
        { value: 3, color: "#0080FF" },
        { value: 15, color: "#00FF00" }
      ]
    }, {
      type: "opacity",
      field: "Magnitude",
      stops: [
        { value: 1, opacity: 0.5 },
        { value: 8, opacity: 1 }
      ]
   }]
});

方法概述

显示继承的方法 隐藏继承的方法
名称 返回值类值 描述

添加一个或多个与对象的生命周期相关联的句柄。

更多详情
Accessor
FlowRenderer

创建 renderer 的深度克隆。

更多详情
FlowRenderer
*

创建此类的新实例并使用从 GeoScene 产品生成的 JSON 对象值对其进行初始化。

更多详情
FlowRenderer
Boolean

如果存在指定的句柄组,则返回 true。

更多详情
Accessor

移除对象拥有的句柄组。

更多详情
Accessor
Object

将此类的实例转换为 GeoScene Portal JSON 表示。

更多详情
FlowRenderer

方法详细说明

addHandles(handleOrHandles, groupKey)inherited
起始版本:GeoScene Maps SDK for JavaScript 4.25

添加一个或多个与对象的生命周期相关联的句柄。当对象被销毁时,将移除句柄。

// Manually manage handles
const handle = reactiveUtils.when(
  () => !view.updating,
  () => {
    wkidSelect.disabled = false;
  },
  { once: true }
);

// Handle gets removed when the object is destroyed.
this.addHandles(handle);
参数
handleOrHandles WatchHandle|WatchHandle[]

对象销毁后,标记为要移除的句柄。

groupKey *
optional

标识句柄应添加到的组的键。组中的所有句柄稍后都可使用 Accessor.removeHandles() 进行删除。如果未提供键,则句柄将被添加到默认组。

clone(){FlowRenderer}

创建 renderer 的深度克隆。

返回
类型 描述
FlowRenderer
示例
// Creates a deep clone of the first layer's renderer
let renderer = view.map.layers.getItemAt(0).renderer.clone();
fromJSON(json){*}static

创建此类的新实例并使用从 GeoScene 产品生成的 JSON 对象值对其进行初始化。传入到输入 json 参数的对象通常来自对 REST API 中查询操作的响应或来自另一个 GeoScene 产品的 toJSON() 方法。有关何时以及如何使用该函数的详细信息和示例,请参阅指南中的使用 fromJSON() 主题。

参数
json Object

GeoScene 格式实例的 JSON 表示。有关各种输入 JSON 对象的结构示例,请参阅 GeoScene REST API 文档

返回
类型 描述
* 返回该类的新实例。
hasHandles(groupKey){Boolean}inherited
起始版本:GeoScene Maps SDK for JavaScript 4.25

如果存在指定的句柄组,则返回 true。

参数
groupKey *
optional

组键。

返回
类型 描述
Boolean 如果存在指定的句柄组,则返回 true
示例
// Remove a named group of handles if they exist.
if (obj.hasHandles("watch-view-updates")) {
  obj.removeHandles("watch-view-updates");
}
removeHandles(groupKey)inherited
起始版本:GeoScene Maps SDK for JavaScript 4.25

移除对象拥有的句柄组。

参数
groupKey *
optional

要移除的组键或组键的数组或集合。

示例
obj.removeHandles(); // removes handles from default group

obj.removeHandles("handle-group");
obj.removeHandles("other-handle-group");
toJSON(){Object}

将此类的实例转换为 GeoScene Portal JSON 表示。有关详细信息,请参阅使用 fromJSON() 指南主题。

返回
类型 描述
Object 此类实例的 GeoScene Portal JSON 表示。

您的浏览器不再受支持。请升级您的浏览器以获得最佳体验。请参阅浏览器弃用帖子以获取更多信息