问题标签 [deck.gl]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
307 浏览

javascript - deck.gl 获取 TripsLayer 的颜色

Deck.gl 我只有一个行程要展示,我想让行程的每个坐标都有不同的颜色。但颜色不随地点和时间的变化而变化,通常为黑色。我在'trips.json'中设置了color的属性,可以列举如下:

在此处输入图像描述

0 投票
1 回答
312 浏览

reactjs - Mapbox GL、Deck GL 和 React Map GL 之间的底层架构是什么?

我正在开发一个使用交互式地图可视化功能的 React webapp。我们正在使用 deck.gl 库和 react-map-gl。React Map GL 被 Deck GL 定义为“一个围绕 Mapbox GL 的 React 包装器,可与 deck.gl 无缝协作”

在阅读了这个定义之后,我感到困惑并质疑一切在架构上究竟是如何联系在一起的。我认为 Deck GL 和 Mapbox GL 是两个独立的库。

有人可以向我解释一下这一切是如何结合在一起的吗?Mapbox、Mapbox GL、Deck GL、React Map GL 和任何其他相关的库/框架?

0 投票
6 回答
1469 浏览

python - pydeck r.show() 输出 TypeError: vars() 参数必须具有 __dict__ 属性

到目前为止,一切正常。我创建了一个新文件来创建新的热图。我的数据框如下所示:

这始终与我之前在创建热图确切名称和其他列时使用的数据框完全相同。

复制粘贴之前创建热图的代码:

当我运行 w/o r.show() 它不显示任何东西,当我运行 r.show() 它输出TypeError: vars() argument must have __dict__ attribute

我无法弄清楚出了什么问题......

0 投票
2 回答
1081 浏览

reactjs - Display: none on Deck.gl React 组件导致巨大的性能问题

编辑:此问题特定于此设置。如果您想提供帮助,请使用此处的代码。谢谢!

我正在使用 Deck.gl 和 react 来显示地图。当我尝试使用 display: none 隐藏地图时,它开始冻结我的整个计算机。我已经通过使用 visibility: collapse 来解决这个问题,但我想知道为什么 display: none 会导致这个问题。

控制台开始永远充满警告:

我查看了 React Profiler 的性能: React Profiler output

在处理时间比正常时间长的每个提交中,它显示 AutoSizer 需要很长时间来呈现。

重现问题

节点版本:v10.16.3

  1. 运行 create-react-app my-app。
  2. 复制下面的代码。
  3. 将 display: none 应用于包含地图的任何元素,包括 Deck.gl 渲染的元素。

警告:重现此问题会占用大量资源,并且可能会使您的计算机崩溃!

编码

索引.tsx

GeoMapChart.tsx

索引.html

包.json

webpack.config.js

tsconfig.json

0 投票
0 回答
373 浏览

reactjs - 收到错误:在 Reactjs 挂钩中添加 deckGL 时无法反转矩阵

我是 reactjs 和 deckGL 的新手,我对下面的代码有一点问题。我正在尝试使用 FlyToInterpolator 添加 DeckGL 以使标记居中。单击按钮后,我收到此错误,但是当我使用 react-map-gl + FlyToInterpolator 时,它可以工作。

更新:问题是,我在deckGL 中使用FlyToInterpolar API 时遇到问题,但在react-map-gl 中使用FlyToInterpolar 没有问题。

请帮忙!非常感谢 p/s:抱歉英语不是我的主要语言。

错误:

代码:

非常感谢 :)

0 投票
0 回答
598 浏览

reactjs - 尝试导入错误:使用deck.gl 和react + next.js 未从“react”导出“cloneElement”

我有一个使用 React + Typescript + Nextjs 没有错误的项目,但是当我安装并尝试使用时,我收到以下错误:

尝试导入错误:“cloneElement”未从“react”导出。

在 .next/build-manifest.json 中找不到 /index 的文件

ModuleDependencyError:“在'react'中找不到导出'cloneElement'

这是我的package.json

0 投票
1 回答
463 浏览

vuejs2 - 将 DeckGL 与 Vue.js 一起使用

我正在努力让 Deck 与 vue 一起玩。直到今天我发现的所有示例都被黑了,不是我的用例,或者已经过时了。

有谁知道一个很好的第一步来源我可以看看开始?

0 投票
2 回答
722 浏览

reactjs - 如何使用deck.gl中的数据?

我是 deck.gl 的新手并且遇到了一些问题。每当我尝试使用 API 作为数据时,就像我尝试使用以下 api

但它不起作用,或者如果我将 api 的数据放在一个 json 文件中并将其放在我当前的工作目录中它不起作用,例如:

甚至 .csv 文件也不起作用,但是当我以数组形式使用数据时,就像遵循它一样。我不知道为什么如果有人知道请帮助我。

我说的是 _renderLayers() 中的数据

0 投票
1 回答
191 浏览

mapbox-gl-js - 如何创建具有对数大小比例的 HexagonLayer

我在 3D 中创建了一个可以完美渲染和工作的图层。

我想创建一个HexagonLayer,他的高度将基于我认为我正确执行的所有卷的总和。

但我不知道该大小比例是否应该按日志,正如您在开普勒图像中看到的那样。

如何使用日志大小比例?

这是我的代码:

图片

在此处输入图像描述

0 投票
1 回答
941 浏览

reactjs - 更改deck.gl中单击项目的颜色

我正在尝试实现与移动设备上的 autoHighlight 道具相同的行为,其中单击项目“选择”它并更改其颜色。我设法使它与 deck.gl 的 updateTriggers 属性一起工作,但我觉得我错过了一些东西,因为更新需要 3 秒,而且此时图层没有响应。

这是到目前为止的内容: