如何在nvd3中的Y轴上设置自定义刻度和标签 [英] Howto set custom ticks and labels on Y axis in nvd3

查看:235
本文介绍了如何在nvd3中的Y轴上设置自定义刻度和标签的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想为在nvd3中完成的离散图表设置自定义刻度号和标签。问题是标签和值需要以10:1、8:1等比例显示,但实际条形高度显示为数字10、8等。是否有任何方法可以在y轴和鼠标悬停时创建自定义标签nvd3中的工具提示?

I'd like to set custom tick number and labels for my discrete chart done in nvd3. The problem is that labels and values needs to be shown in ratios like 10:1, 8:1 etc. but actual bar height shown as numbers 10, 8 etc. Is there any way to create custom labels on y axis and on mouse over tool-tips in nvd3?

推荐答案

您可以使用 tickFormat (实际上是原始的D3方法):

You can do this using tickFormat (which is actually a raw D3 method):

chart.yAxis
    .tickFormat(function (d) {
        return  d + ':' + 1;
    });

NVD3将在工具提示中自动使用该格式。

NVD3 will automatically use that format in the tooltip.

如果要单独编辑工具提示内容,可以使用tooltipContent方法(可能会添加其他方法在下一版NVD3中)。

If you wanted to edit the tooltip content separately you could use the tooltipContent method (other methods will likely be added in the next release of NVD3).

chart.tooltipContent(function (key, x, y, e, graph) {
    return '<h3>' + key + '</h3>' +
        '<p>' +  y + ' on ' + x + '</p>';
});

请参见此柱塞

这篇关于如何在nvd3中的Y轴上设置自定义刻度和标签的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆