d3.js 相关问题

如果依赖数组频繁更改，在 useEffect 中仅调用一次条件函数的最佳方法？

我在 React 应用程序中使用“Scrolllytelling”，需要根据某个部分的当前滚动进度动态更改 svg。 例如这样： 使用效果（（）=> { ...

为什么图例在缩放时会与 d3.js 折线图合并？

我正在尝试向名为 d3.js 的示例添加图例 d3.js 中放大的折线图 1°）我添加了脚本： // 添加图例矩形 line.append('矩形') .attr('x', 宽度 - 80) ....

d3.js中没有固定间隔时可以进行画笔捕捉吗？

我在 d3 中有一个使用焦点/上下文的条形图。当用户刷选日期时，我想捕捉到可用的日期，而不是他们能够刷到开始之间的任何日期...

D3 禁用加载时的初始动画

我只想做这个简单的事情，经过大量谷歌搜索后找不到任何答案（顺便说一句，D3 中的菜鸟）。 示例代码加载json文件并绘制它 这是整个代码 ...

我的问题是我将在D3饼图中添加一条折线

我的问题是图表中的折线没有正确定位在代码中给出的切片上的确切数据上 这是我的切片和折线代码，当你转换此代码时...

在 HTML 中嵌入 csv 以与 D3.js 一起使用

在 D3.js 中，通常从外部 csv 文件加载数据。这对于大数据来说非常高效，并且避免了数据变化时更改代码。 不过，有两种情况（仅使用...

将鼠标悬停在技能气泡上时工具提示闪烁问题（React 和 d3）

我在网站上遇到工具提示问题，当鼠标悬停在技能气泡上时，工具提示不断闪烁。我已经在固定位置实现了工具提示，但是每当出现气泡时......

如何更新 d3 投影以匹配缩放变换？

这是我的地图的缩放处理程序： 常量缩放 = d3.zoom() .scaleExtent([1,25]) .translateExtent([[宽度*-0.5,高度*-0.5],[宽度*1.5,高度*1.5]]) .on('缩放', (ev) => { ...

D3.js Sankey 图：在每列节点上方添加标题（文本）

我想在 D3.js Sankey 图中的每列节点上方添加标题。例如，我举这个例子：http://bl.ocks.org/d3noob/5028304，这就是我想要的结果： 桑基图 我以为

如何更新 d3 投影以匹配缩放变换？

这是我的地图的缩放处理程序： 常量缩放 = d3.zoom() .scaleExtent([1,25]) .translateExtent([[宽度*-0.5,高度*-0.5],[宽度*1.5,高度*1.5]]) .on('缩放', (ev) => { ...

使用d3访问txt本地文件

我是 D3、Javacript 和 HTML 新手。 我的项目的存储库如下： 项目： facebook_combined.txt 索引.html 网络.js 我正在尝试从index.html访问facebook_combined.txt...

D3 在鼠标悬停事件后重新分配元素属性

我有一个带有 mouseenter 和 mouseleave 事件的多线图表，一次突出显示一行，并在鼠标离开时使其变暗 此图表中还有一些按钮，用户可以选择查看...

如何在textPath / D3.js v7中使用.HTML()

我希望我的文本标签分为两行。例如，名称： “主题 A 描述”，第一行“主题 A”，第二行“描述”。 我知道...

如何使用 D3.js 以编程方式创建的数据绘制图表

我正在开发一个应用程序，其中数据集具有以编程方式生成的名称，并且经常由用户创建和销毁。我想使用 D3.js 在应用程序中绘制这些数据集的图表

如何使用 D3.js 为 Javascript 地图对象中的每个组绘制单独的线

我有一个名为 graphData 的数据集，其中包含三个值：波长、幅度和名称。 让数组= [ {名称：“数据集1”，波长：2，幅度：20} {名称：“数据集1”，wavelen...

如何在不使用变换旋转的情况下从下到上书写垂直文本？

使用书写模式，您只能从上到下阅读文本。根据 https://developer.mozilla.org/en/docs/Web/CSS/writing-mode 我唯一的选择是使用侧面。但这

React-d3-tree 缩放和拖动在 Next.js 13 上不起作用

我正在开发一个 Next.js 13 项目，使用react-d3-tree 库来渲染树结构。我已将缩放和拖动属性添加到我的树组件中，但我遇到了一个问题...

从networkd3 sankey图中提取结果

我是新来的，这是我第二次发帖，因为之前的帖子被删除了，我不知道问题是什么，如果你能在删除po之前说明原因就太好了。 ..

D3 多线图表显示 1 条线而不是 3 条

我正在使用 D3v7 创建 3 线图表，但只显示 1 个。我不明白为什么。 这是我的数据集： 电流输出： 看看我下面的代码： // 设置 SVG var svg = d3.select("身体...

如何从图表库中删除出现在饼图扇区上的蓝色矩形？

当单击图表库中饼图中的扇区时，我希望不出现蓝色矩形。 React 应用程序中正在使用 recharts 库。 当单击图表库中饼图中的某个扇区时，我希望不出现蓝色矩形。 React 应用程序中正在使用 recharts 库。 <PieChart width={800} height={400} onMouseEnter={this.onPieEnter}> <Pie data={data} cx={120} cy={200} innerRadius={60} outerRadius={80} fill="#8884d8" paddingAngle={5} dataKey="value" > <Tooltip cursor={{ stroke: 'red', strokeWidth: 2 }} /> {data.map((entry, index) => ( <Cell stroke="5" style={{ filter: `drop-shadow(0px 0px 5px ${COLORS[index % COLORS.length]}` }} key={`cell-${index}`} fill={COLORS[index % COLORS.length]} /> ))} </Pie> <Pie data={data} cx={420} cy={200} startAngle={180} endAngle={0} innerRadius={60} outerRadius={80} fill="#8884d8" paddingAngle={5} dataKey="value" > {data.map((entry, index) => ( <Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} /> ))} </Pie> </PieChart> 您应该将 outline: none 添加到图表元素 <PieChart width={800} height={400} onMouseEnter={this.onPieEnter}> <Pie data={data} cx={120} cy={200} innerRadius={60} outerRadius={80} fill="#8884d8" paddingAngle={5} dataKey="value" > <Tooltip cursor={{ stroke: "red", strokeWidth: 2 }} /> {data.map((entry, index) => ( <Cell stroke="5" style={{ filter: `drop-shadow(0px 0px 5px ${COLORS[index % COLORS.length]}`, outline: "none", }} key={`cell-${index}`} fill={COLORS[index % COLORS.length]} /> ))} </Pie> <Pie data={data} cx={420} cy={200} startAngle={180} endAngle={0} innerRadius={60} outerRadius={80} fill="#8884d8" paddingAngle={5} dataKey="value" > {data.map((entry, index) => ( <Cell style={{ outline: "none" }} key={`cell-${index}`} fill={COLORS[index % COLORS.length]} /> ))} </Pie> </PieChart>; 您可以在 outline: none 组件中添加 <Pie/> <Pie ... style={{outline: 'none'}} />