【源码】基于天地图api4.0的风场可视化插件

项目简介

这是一个基于天地图api4.0开发的风场可视化插件，能够帮助用户方便快捷地实现风场数据的可视化展示。

项目的主要特性和功能

1. 简单易用：仅需提供数据，即可快速生成风向图。
2. 性能高效：内置优化配置，提升展示性能。
3. 配置丰富：提供图层层级、样式、粒子效果等多种配置选项，满足个性化需求。
4. 适配性强：能与天地图或其他地图库无缝集成，适用于多种地图场景。

安装使用步骤

安装插件

用户下载项目源码文件后，可通过以下命令安装tmap-wind插件： shell npm install tmap-wind -S

引入插件

在项目中引入tmap-wind插件： javascript import("tmap-wind").then(({ WindLayer }) => { // 使用插件的代码 });

使用插件

依据示例代码，利用WindLayer创建风场可视化视图，并配置必要参数。

配置数据

借助setData方法更新数据，实现风场数据的实时更新。

管理视图

通过hide、show方法控制视图的显示与隐藏，通过removeOverLay方法移除视图。

配置项说明

tmap-wind配置项

| 参数 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | zIndex | 指定canvas图层层级 | number | 无 | | customStyle | 是否使用自定义的样式，使用后zIndex配置将失效，需自行设置zIndex | string | position:absolute; left:0; top:0; z-index: ${this.zIndex} ;user-select:none; | | isDisableAutoConfig | 是否禁止使用插件的默认配置项 | boolean | false |

WindCore配置项

| 参数 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | globalAlpha | 全局透明度，主要影响粒子路径拖尾效果 | number | 0.9 | | lineWidth | 粒子路径宽度，支持回调函数 | number \| function | 1 | | colorScale | 粒子颜色配置，支持回调函数或颜色数组 | string \| function \| string[] | #fff | | minVelocity、maxVelocity | 粒子最小、最大风速，用于颜色索引计算 | number | 非必填、必填 | | velocityScale | 粒子路径步长乘积基数 | number | 1 / 25 | | maxAge | 粒子路径最大帧数 | number | 90 | | paths | 生成的粒子路径数量，支持回调函数 | number \| function | 800 | | particleMultiplier | 粒子路径数量系数（视野宽度 * 高度 * 系数） | number | 1 / 300（不推荐使用） | | frameRate | 帧率（ms） | number | 20 |

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】