如何在nvd3多参数图上显示值
How to display values on top of nvd3 multi par graph?
我希望每个栏的实际值按照这里的方式显示在顶部
我正在多条形图上尝试。
找不到参考
如何在堆叠多柱图中显示值- nvd3图形
有一个修复你可以自己实现https://gist.github.com/topicus/217444acb4204f364e46
编辑:如果github链接被删除,复制代码:
// You need to apply this once all the animations are already finished. Otherwise labels will be placed wrongly.
d3.selectAll('.nv-multibar .nv-group').each(function(group){
var g = d3.select(this);
// Remove previous labels if there is any
g.selectAll('text').remove();
g.selectAll('.nv-bar').each(function(bar){
var b = d3.select(this);
var barWidth = b.attr('width');
var barHeight = b.attr('height');
g.append('text')
// Transforms shift the origin point then the x and y of the bar
// is altered by this transform. In order to align the labels
// we need to apply this transform to those.
.attr('transform', b.attr('transform'))
.text(function(){
// Two decimals format
return parseFloat(bar.y).toFixed(2);
})
.attr('y', function(){
// Center label vertically
var height = this.getBBox().height;
return parseFloat(b.attr('y')) - 10; // 10 is the label's magin from the bar
})
.attr('x', function(){
// Center label horizontally
var width = this.getBBox().width;
return parseFloat(b.attr('x')) + (parseFloat(barWidth) / 2) - (width / 2);
})
.attr('class', 'bar-values');
});
});
显然这还不存在。有一个问题(https://github.com/novus/nvd3/issues/150)已经关闭,因为这(显然)很难实现。
我不知道你已经尝试了这么多,但在这里的例子是相当直接的。
.showValues(true)
几乎做到了这一点。
希望能有所帮助。
相关文章:
- 必应地图没有'当我向函数添加另一个参数时,t显示
- 为什么参数对象没有在控制台中显示它的方法
- jquery jqgrid 不显示结果,具体取决于 JSON 对象中的参数
- 通过发送POST参数在ExtJS 4中显示PDF
- qoxdoo:POST方法,不在URL中显示参数
- 仅显示部分参数的警报
- 如何使用 javascript 在 HTML 电子邮件中显示动态参数
- 序列化的 Ajax 参数未显示在 PHP 中
- 仅当 URL 具有特定参数时才显示引导模式
- 获取 url 参数并将其显示在 jquery 对话框中
- 角度中的组合框(选择组件)不基于参数设置显示值
- 传递给句柄帮助程序的参数显示为键而不是值
- 如何手动触发 ForeSee 调查对话框以使用 javascript 显示?或网址参数
- Google Analytics(分析)跟踪 - 可扩展参数 (utme) 未显示在请求_utm.gif
- javascript将函数名作为参数传递,不适用于jquery显示隐藏
- JS从文本框中抓取文本,传递给asp.net mvc ActionResult,但ActionResult参数显示为nu
- 如何避免在使用Angularjs执行$http GET时在URL中显示参数
- 在控制器中传递js变量,但不在url:yii中显示参数
- 导航到浏览器中没有显示参数的页面
- 使用jQuery .get在URL中显示参数