d3.js - 如何为一条 Y 轴线涂上不同于其他网格线的颜色?

标签 d3.js rickshaw

在 Rickshaw 中,当使用 Rickshaw.Graph.Axis.Y.Scaled 轴时,我想给一个特定的 Y 轴网格线涂上不同于其他 Y 轴网格线的颜色。我可以用 jQuery 做到这一点(特别是 32° 是我关心的线):

$('#container_id * svg * g[data-y-value=32] > line')
  .css('stroke','rgb(255,0,0)')
  .css('stroke-width','2')

是否有一种惯用的、更好的或更安全的方法来为特定的线网格线着色?

最佳答案

嗯,我有一些更惯用的东西,我正在猴子修补渲染器并使用 D3 选择器:

var y_grid = new Rickshaw.Graph.Axis.Y.Scaled({
  graph: graph,
  tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
  tickValues: y_tick_vals,
  scale: scale
});
// Begin monkey business
var old_render = y_grid.render
y_grid.render = function() {
  old_render.apply(y_grid,arguments)
  y_grid.graph.vis.select('svg .y_grid g[data-y-value="32"] line')
    .style('stroke','rgb(255,0,0)')
    .style('stroke-width','1')
}

关于d3.js - 如何为一条 Y 轴线涂上不同于其他网格线的颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28589517/

相关文章:

javascript - d3.js 从文件中解析类似 JSON 的数据

javascript - 为什么我的 d3 可视化在控制台中呈现,但不在浏览器中呈现?

d3.js - 使用带有 "viridis"配色方案的scaleQuantile

javascript - 如何使用 D3.js 将返回函数连接到 SVG 转换属性

带有 Dashing 和 Rickshaw 的 CSS 选择器

javascript - D3.js 比例 : Return the smaller of a constant and the value of a scale?

javascript - 如何删除人力车直方图中的垂直线?

javascript - 更改人力车图上的数据源/系列

jquery - 未捕获的异常 : series is not an array rickshaw