问题标签 [area-chart]

当我在 Chartjs 中使用左右线图时，有时会得到不一致的 Y 轴刻度间隔计数。所以，我可能在左边有 7 个间隔，Chartjs 可能会自动在右边放置 10 个。一个难以阅读的图表示例如下所示：

因此，问题是——如何设置右侧的 Y 轴刻度间隔，使其与左侧一致？

例如，当我想将鼠标悬停在我的面积图点符号上时，我不能这样做，因为它们可能会相互重叠。

查看图片： 未触发悬停事件 - 未显示工具提示

将鼠标悬停在触发的事件上 - 显示工具提示

也许我可以将图表放在同一层或类似的地方以使其正常工作？

我注意到：随着图表的加载，新的图表覆盖了旧的图表。我可以先加载 Y 轴值较高的图表，然后再加载 Y 轴值较小的图表。但该解决方案仅适用于每个图表点明显大于/小于其他图表点的情况。

我有一个用例，我想绘制面积图和条形图/折线图。我可以毫无问题地做到这一点。

我现在面临的问题是当条形和区域被绘制在一起时颜色的重叠。（示例如下）。如您所见，在此图中，由于绘制的区域，条形图的颜色变得阴暗。

面积+条形+线

我想做的是将区域画布绘制为背景，将其他画布绘制为前景。（PS：我尝试通过改变绘制系列的顺序，这也改变了画布的顺序，但效果保持不变）

有没有办法做到这一点 ？

我正在尝试创建一个带有渐变区域填充的 d3 区域图。但是，如果图形数据以 0 以外的值开始或结束，则该区域将填充在线上方。这是代码的工作小提琴。

https://jsfiddle.net/damamgova/dhLb67mt/

我在我的应用程序上通过 recharts 实现了 AreaChart，如下所示：

它现在工作正常，但我在控制台（chrome）中收到了这个警告。

警告：componentWillReceiveProps 已重命名，不推荐使用。有关详细信息，请参阅“一些链接”。

• 将数据获取代码或副作用移动到 componentDidUpdate。

• 如果您在 props 更改时更新状态，请重构您的代码以使用记忆技术或将其移动到静态 getDerivedStateFromProps。了解更多信息：“一些链接”

• 将 componentWillReceiveProps 重命名为 UNSAFE_componentWillReceiveProps 以在非严格模式下抑制此警告。在 React 17.x 中，只有 UNSAFE_ 名称可以使用。要将所有已弃用的生命周期重命名为新名称，您可以npx react-codemod rename-unsafe-lifecycles在项目源文件夹中运行。

请更新以下组件：Animate、Area、AreaChart、Text

我正在使用 react 16.9.0。

您对删除此警告有什么建议吗？

在 LightningchartJS 中，我们可以在区域范围系列中使用不同颜色突出显示较低范围和较高范围。是否有可能在其他面积图中实现相同的效果？在当前情况下，我有一个双极区域图，我想在其中标记高低范围。我尝试使用setHighStrokeStyle，但它似乎只适用于区域范围系列，我们是否也有类似的区域系列？

尝试了以下代码

没有高光的区域系列的图像

高低范围的图像以不同的颜色突出显示

是否可以在面积图中显示反向填充？

我正在使用 Vue-apex-charts 库。我正在尝试创建一个如下所示的图表，其中红色区域不是从基线堆叠起来，而是从图表顶部下降。

我对 d3js 很陌生，我正在尝试修改示例：https ://blockbuilder.org/lorenzopub/9d030cdfe0f3564fd5d7b9047e440084 。我想用一个简单的线图替换第一个区域。我只更改了这些代码行：

但我明白了： 有人可以帮助我吗？

I am working on a line graph, which should show a trend in the likelihood of certain issues over time. My goal is to highlight two areas under the line - (2008-2010) and (2015-2017) - without highlighting the area above the line. I tried with geom_area() but it did not work out, as the variable, which defines groups for highlighting, is binary, i.e., 2008, 2009, 2010, 2015, 2016, 2017 are coded as 1 and 0 otherwise.

As you see on the graph, I could only create colored bars by now but want to avoid them, as they do not really look very intuitive:

Here is the code for generating this graph:

The data is structured as following:

And the desired output would be:

Thanks in advance for your help!

我正在尝试将一条线附加到面积图路径的末尾。我所在区域最困难的部分是动画。我有一个clipPath，它的宽度被转换width: 0为width: 960，最后的线随之而来，所以应该同步。此外，该行顶部的文本也需要在进行时进行更新。

期望的输出：

我最初的想法是建立一个图表区域并添加一个clipPath，然后在区域图中添加一个条形图，这样我就可以根据附加的条形更新我的文本，但是条形图不在我的区域图中。在面积图中放置条形图我做错了什么还是有更好的解决方案？