我在dc中绘制一个复合图表,其中包含一个条形图和一个折线图。使用的代码如下。但是,条形图的工具提示很好,但线图的工具提示根本没有显示出来。我几乎没有任何可用的示例可供查看。任何帮助将不胜感激
compositeChart.width(1200)
.height(240)
.margins({top: 10, right: 100, bottom: 70, left:80})
.transitionDuration(800)
.dimension(depValue)
.elasticY(true)
.filter('(All)')
.x(d3.scale.ordinal().domain(["AUTO & TIRES","BABY","CLOTHING","ELECTRONICS","GARDEN","GROCERY","HEALTH","HOME","HOME IMPROVEMENT", "PHOTO","SPORTS", "TOYS","VIDEO GAMES"]))
.xUnits(dc.units.ordinal)
.renderHorizontalGridLines(true)
.compose([
dc.barChart(compositeChart)
.width(1200)
.height(240)
.group(group,"This Year")
.valueAccessor(function (p) {return p.value})
.clickFilterBehavior("replace")
.title(function(d) { return d.key + ": " + d3.round(d.value,2); })
.barPadding(0.5)
.brushOn(false)
.elasticY(true)
.filter('(All)')
.margins({top: 10, right: 100, bottom: 70, left:80})
.gap(15),
dc.lineChart(compositeChart)
.width(1200)
.height(240)
.group(group1,"Last Year")
.valueAccessor(function (p) {return p.value})
.margins({top: 10, right: 100, bottom: 70, left:80})
.yAxisLabel($('metric').value+'(TY)')
.brushOn(false)
.title(function(d) { return d.key + ": " + d3.round(d.value,2); })
.elasticY(true)
.colors('black')
])
.yAxisLabel($('metric').value+'(TY)')
.renderHorizontalGridLines(true)
compositeChart.renderlet(function(chart){
chart.selectAll("g.x text")
.attr('transform', "rotate(30)")
.style('text-anchor','start')
.style('font-weight','bold');
});
答案 0 :(得分:0)
我遇到了同样的问题,但我设法以一种奇怪的方式解决了这个问题。在我的图表上,我有一个resetAll
按钮,按下它会使线条工具提示起作用。经过几次尝试,我发现两次调用renderAll()
就可以了。我不知道如何修复它,但我认为它可能是dc.js
的错误。
dc.renderAll();
dc.renderAll();