javascript - d3.js:动态为轴添加颜色

标签 javascript d3.js svg charts

我正在尝试在 d3.js 中创建折线图。该图表的轴颜色仅在运行时可用,并且可以在大量颜色中变化。可以设置轴的颜色使用像 this 这样的 css 类。

但是由于我的图表可以采用的颜色范围很大并且只能在运行时使用,因此使用此解决方案是不可行的。使用 call(yAxis).style("lines",userColor) 设置轴标签和刻度上使用的字体颜色,但不设置轴本身的颜色。

是否可以使用javascript动态设置d3.js轴中轴的颜色?

最佳答案

我认为您可能想要的是如下内容:

d3.selectAll('.axis path')
    .style("stroke", userColor)
    .style("fill", userColor)

在这种情况下,.axis path 应该是轴线上的一些标识 CSS(也可能与 d3 一起放入 yAxis 函数中)。您可能只需要 fill Stroke 之一,尝试一下看看哪种适合您。这应该在实际轴线上操作,而不是文本元素

关于javascript - d3.js:动态为轴添加颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33052519/

相关文章:

javascript - 无法使用文本框值和计算值进行数学运算

javascript - Javascript 中的左 trim

ios - 为 iOS 应用程序加载基于 SVG 的图像资源

javascript - 在 svg 组上模拟点击事件

javascript - 如何使用 replace 方法重写 url 路径?

javascript - 很难理解 gridfs 和连接

javascript - d3 text-wrap 插件更改坐标

javascript - 如何消除c3js折线图中的轴线溢出

javascript - 使用 Enter 和 Exit 更新 D3 v4 中的数据不起作用

javascript - 将 Hammer.js 触摸手势与 jQuery SVG 缩放库集成