echarts gl 3D图

最新推荐文章于 2024-08-09 07:18:07 发布
最新推荐文章于 2024-08-09 07:18:07 发布
阅读量1.2k 收藏 3
点赞数 1
分类专栏： vue-echarts npm 文章标签： npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_32332433/article/details/112790360
版权

目前安装echarts-gl版本2.0.0的话需要对应echarts版本5.0.0，echarts版本5.0.0里不带map文件夹。
如果echarts版本较低 最好使用echarts-gl的1.0.0版本。因为echarts-gl版本2.0.0里会有一些引用是echarts版本较低的没有的。

以上，在解决install报错时，如果不方便升级现有包的版本，就需要尝试降低即将安装的包的版本
可以先清一下缓存
npm cache clean --force
然后
npm install node包名字@版本 --save

不想996了的小姑娘
关注
专栏目录
echarts-gl
12-14
百度官网给出的echarts版本与echarts-gl版本不匹配,这里给出历史版本下载
echarts-gl.js
12-15
ECharts GL 新增了三维的笛卡尔坐标系、地理坐标系，并且在这些新的三维坐标系基础上提供了六个新的系列类型，包括 散点图 scatter3D、折线图 line3D、柱状图 bar3D、曲面图 surface、飞线图 lines3D以及地图 map3D。展示出你想要的三维可视化作品。
echarts 与echarts-gl 版本对应，否则会报错
Bright2017的博客
01-25 489
echarts与echarts-gl 版本对应，否则会报错！
ECharts-GL 深度指南
最新发布
gitblog_00650的博客
08-09 1163
ECharts-GL 深度指南 echarts-glExtension pack for Apache ECharts, providing globe visualization and 3D plots.项目地址:https://gitcode.com/gh_mirrors/ec/echarts-gl 项目介绍 ECharts-GL 是 Apache ECharts 的扩展包，专门用于提供地...
ECharts-GL三维数据可视化
weixin_52905182的博客
07-26 862
多次调用 echarts.init 会导致内存泄漏，应当在恰当时机销毁已经存在的 ECharts 实例，clear()不会销毁实例，只是重新绘制图形，dispose()会销毁实例，需要重新构建 ECharts 对象。ECharts-GL，作为 ECharts 家族的一员，继承了 ECharts 的易用性和高性能，还引入了 WebGL 技术，用于创建令人惊叹的 3D 地图和数据可视化作品。~在绑定事件监听器时，要确保正确解绑，可以使用 ECharts 提供的off方法来取消事件。
echart echart-gl
jia_huining的博客
11-26 2784
import { mapdata} from '@/api/sendjob/130000.js'; var mapechart = this.$echarts.init(this.$refs.map);//初始化 this.$echarts.registerMap('mapname', mapdata} ); var option = { tooltip: { // 提示框 trigger: 'item', formatt...
echartsGl 3d地图
02-25
前端开发展示
基于ECharts GL的3D图表展示设计与实现
04-15
ECharts GL是ECharts的高级扩展，主要针对3D图表、大规模散点图和地理图表等场景。它基于WebGL技术，能够在浏览器中实现高性能的图形渲染，使开发者能够创建出具有视觉冲击力的3D图表，同时保持良好的交互性。 **3D...
ECharts-GL 3D地球实例（动态改变自转、加载去空白圆心）
05-11
ECharts-GL是一款基于ECharts扩展的3D图表库，它为用户提供了丰富的3D可视化效果，包括3D地球、3D柱状图等。在本实例中，我们将重点探讨如何实现ECharts-GL 3D地球的动态自转、解决加载时出现空白圆心的问题，以及...
echarts结合echarts-gl实现3D飞线地球可视化
08-05
ECharts-GL提供了3D地图、粒子系统、3D柱状图等多种3D图表，其中3D飞线图用于展现地理路径，如航线、航班轨迹等。要实现3D飞线地球，你需要创建一个HTML页面，引入ECharts和ECharts-GL的JavaScript库，并设置一个...
echarts~echarts-gl 配套版本文件
11-02
echarts~echarts-gl 配套版本文件
echarts-gl.min.js
10-18
echarts-gl.min.js文件,辅助echarts开发 插件,完整文件 可下载使用
echarts GL js
07-31
echarts中的GL表格js文档，需要单独引用，包JL 3d bar等
echarts-gl.7z
09-04
ECharts GL 新增了三维的笛卡尔坐标系、地理坐标系，并且在这些新的三维坐标系基础上提供了六个新的系列类型，包括 散点图 scatter3D、折线图 line3D、柱状图 bar3D、曲面图 surface、飞线图 lines3D以及地图 map3D。
ECharts-GL 3D可视化库 v2.0.8.zip
03-21
1. **3D图表类型**：ECharts-GL支持多种3D图表，如3D散点图、3D柱状图、3D地形图、3D网格图、3D流线图等。这些图表使数据呈现更直观，帮助用户从不同角度理解复杂的数据关系。 2. **GPU加速**：利用WebGL技术，...
266Echarts - GL 矢量场图（Global wind visualization）
阿甘兄
05-06 2360
效果图 源代码 $.getJSON('data-gl/asset/data/winds.json', function (windData) { var data = []; var p = 0; var maxMag = 0; var minMag = Infinity; for (var j = 0; j < windData.ny; j++)...
推荐开源项目：ECharts-GL —— 3D数据可视化的强大工具
gitblog_00089的博客
05-12 2165
推荐开源项目：ECharts-GL —— 3D数据可视化的强大工具 echarts-glExtension pack for Apache ECharts, providing globe visualization and 3D plots.项目地址:https://gitcode.com/gh_mirrors/ec/echarts-gl 项目介绍 ECharts-GL是著名的数据可视化库Ap...
echarts + echarts-gl - 使用geo3d + map3d + scatter3D做3d地图
热门推荐
weixin_42060560的博客
01-06 1万+
3d地图，有贴图材质
echarts gl geo3D，船的位置调整
06-13
ECharts GL 是 ECharts 的 3D 版本，它扩展了 ECharts 基于 WebGL 的可视化能力，特别适用于地理空间数据和复杂3D场景的展示。Geo3D 是 ECharts GL 中用于创建3D地球地图的部分，它可以展示地理位置、城市、地形等地理信息，并且支持船只等3D元素的动态位置调整。 在使用 ECharts GL 的 Geo3D 地图上，你可以通过以下几个步骤调整船只的位置： 1. **初始化图表**: 首先，你需要在 ECharts GL 中初始化一个 Geo3D 实例，并配置好地图数据和基本样式。 ```javascript const myChart = echarts.init(document.getElementById('container'), 'echarts-gl'); myChart.setOption({ geo3D: { map: 'world', // ...其他配置 }, }); ``` 2. **创建船只模型**: 在 `geo3D` 选项中，可以添加一个 `model` 属性来定义船只的 3D 模型，例如使用 `BoxModel` 或 `SphereModel`。 ```javascript geo3D: { ... models: [{ type: 'BoxModel', position: [lon, lat, 0], // lon 和 lat 是船只在地球表面的经纬度坐标 size: [sizeX, sizeY, sizeZ], material: { color: 'blue', // 船只颜色 }, }], } ``` 3. **动态更新位置**: 如果你想实时或定时改变船只的位置，可以通过 JavaScript 更新 `position` 属性。例如，每过一段时间更新一次： ```javascript function moveBoat() { const newLonLat = calculateNewBoatPosition(); // 你可能需要自定义计算新的经纬度 myChart.setOption({ geo3D: { models: [{ position: newLonLat, }], }, }); // 定时器，例如每隔 5 秒执行一次 setTimeout(moveBoat, 5000); } moveBoat(); ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值