问题标签 [datamaps]

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 投票
0 回答
915 浏览

javascript - 实现数据地图的放大

我有一个带有数据地图的地球仪,我想在其中实现一点缩放功能。不缩放到特定国家,只是一个正常的缩放功能。

我应该在哪里寻找它?我是 d3 和数据图的新手。我设法或多或少地对其进行了自定义,但是仍然缺少此缩放功能。

这是代码笔: https ://codepen.io/simii/pen/yZvQmv

还有我的 javascript:

0 投票
2 回答
567 浏览

javascript - DataMaps / 按标识符隐藏弧

我使用DataMaps创建了一张世界地图。

我的目标是根据一些 API 数据在地图上异步显示和隐藏弧线。


我已经尝试过什么

API每 5 秒调用一次,并将响应数据推送到地图中。 (这将在未来被异步调用取代)

在下面的示例中,arcData array代表我的API响应。

我可以通过DOM manipulation. 就我而言,我习惯于d3.selectAll('path.datamaps-arc').transition().duration(3500).style("opacity", 0);慢慢淡出所有弧线并在之后删除它们。


该解决方案基本上有效,但是:

我的问题

同时隐藏所有弧。以后如果异步调用API,会在当前画弧时发生冲突,同时触发删除过程。

我想要的是

一种解决方案,我可以通过某个标识符访问每个弧,并在它们完全绘制后单独删除它们。

0 投票
0 回答
1353 浏览

reactjs - d3 zoom 抛出无法读取 null 错误的属性按钮

以下是确切的错误,

由于我将 React.js 与数据映射一起使用,因此我使用 done 函数来处理缩放事件

这些是我的导入语句,

以下是datamap的完成功能,

我正在使用 D3 版本 4,请找到解决此问题的方法

0 投票
1 回答
97 浏览

reactjs - 如何在数据地图上获得正确的鼠标悬停坐标

我正在使用DataMap,与地图的普通视图不同,我将地图倒置,当鼠标悬停时,工具提示位置与鼠标悬停时的位置不对应

我尝试了不同的代码,以获取准确的坐标,但没有一个能满足我的需求。

在地图反应组件中

第一次尝试

第二次尝试

不幸的是,我无法实现我想要实现的目标,如果有处理此 Datamap 问题经验的人能帮助我提供线索,我将不胜感激。

默认数据映射行为

当前工具提示位置

用于 datamap-hoverover 的 HTML 标记和部分

0 投票
1 回答
382 浏览

javascript - DataMap/D3 - 如何重置缩放?

我有一个基于 D3.js(第 3 版)的DataMaps地图,并且我在其上添加了滚动缩放。唯一的问题是我还没有找到如何重置它的方法。

找到了这两个,但我不知道如何在我的情况下应用它,你能帮忙吗?

非常感谢!

0 投票
1 回答
76 浏览

angular - How to add animation effect on bubbles in datamaps angular 8?

I am looking to add animation effect on the bubbles in the svg map using the datamaps in angular 8. the bubbles are displayed correctly but the animation is not working. This is what I have tried so far

0 投票
1 回答
85 浏览

datamaps - 如何访问 Data-map 对象属性

如何访问 Datamap 对象属性?我试图打印 map.scope 但我没有定义。谁能告诉我如何访问地图对象属性?

0 投票
1 回答
43 浏览

javascript - 如何将数据图中的地图更改为世界地图的图像?

我想将数据图中的地图更改为 svg 图像。这样我就可以在以后根据需要将其更改为不同的地图。是否可以这样做,或者我是否需要更改数据图中的代码以将地图更改为不同的地图?或者有没有办法可以在世界地图上隐藏一些国家?

0 投票
2 回答
695 浏览

javascript - 使用 d3.js 在数据映射中绘制箭头

我是d3.js的新手,我正在尝试创建自定义地图 svg。

通过一些参考,我做了一个自定义地图,如下所示。

箭头指向页面左下角

上述输出的代码片段在这里。

https://jsfiddle.net/9kbp4h6j/

我有一个附在身体上的标记,但我需要的实际输出是,

  1. 箭头必须从图像中显示的气泡开始
  2. 它应该在一些随机方向上结束,以便可以添加一个弹出模板框来描述实际位置。

所以最后我需要的实际输出应该看起来像这样。

从每个位置指出的箭头

任何帮助表示赞赏。

0 投票
1 回答
97 浏览

javascript - 如果位置的“id”有空间,角度数据图不会填充正确的颜色

对于角度数据图,假设这是我的 mapObject,并且我的位置名称带有 id(“AZ”、“CO”、“AZ CO”、“CO AB”)(完全与空格一起)

渲染地图时,填充颜色为:AZ 为中等,CO 为高,“AZ CO”为高,“CO AB”为高。

如果“AZ”和“CO”值在数据内部的顺序不同(首先是“CO”,然后是“AZ”),则填充的颜色为 CO 的高、AZ 的中、“AZ CO”的中、“一氧化碳"

在没有这些位置覆盖它们的情况下,我该怎么做才能获得相应的颜色?

TIA。