我有三个折线图的复合图表。其中一个图表是使用"假的"建议组here.正如您在下面的快照中看到的那样,虽然第三个图表的比例与其他两个图表的比例非常不同。我想要的解决方案是显示一个双轴图表here in pure d3.我认为它可以在主复合图表上使用.renderlet()来完成,但我想知道是否有一个"性感&# 34;纯dc.js的解决方案?
这是一张快照:
这是我的代码。 (在coffeescript中)我尝试在内部图表上使用.y和.yAxis,但这没有效果。
actualValuesChart = dc.lineChart(mainChart)
.group(metric, "actual " + @displayName)
.valueAccessor (d) -> d.value.avg
.colors(['green'])
.interpolate('basis-open')
normValuesChart = dc.lineChart(mainChart)
.group(metric, "normal " + @displayName)
.valueAccessor (d) -> d.value.avg_avg
.colors(['rgba(0,0,255,1)'])
.interpolate('basis-open')
clipsCountChart = dc.lineChart(mainChart)
.group(buildFakeGroup(defaultClipsArray))
.colors(['red'])
.interpolate('basis-open')
# .y(d3.scale.linear().range([100, 0]))
# .yAxis(d3.svg.axis().scale(d3.scale.linear().range([100, 0])))
mainChart
.dimension(@dimension.monthStamp)
.width(thisChart.width + 30)
.height(thisChart.width*.333)
.yAxisLabel(@displayName)
.elasticY(true)
.x(d3.time.scale().domain([minDate,maxDate]))
.xUnits(d3.time.months)
.brushOn(true)
.legend(dc.legend().x(60).y(10).itemHeight(13).gap(5))
.renderHorizontalGridLines(true)
.compose([actualValuesChart,normValuesChart,clipsCountChart])
答案 0 :(得分:5)
是的!它是一个非常新的功能,我自己也没有尝试过,但如果您使用useRightYAxis创建一些子图表,然后在复合材料上设置rightY作为第二个比例尺图表,你应该得到你正在寻找的东西。
但这完全是前沿,我看到该示例目前已被破坏(web / examples / right-axis.html)。因此,如果您遇到问题creating an issue或开始讨论on the user group,请跟进。