dc.js의 이중 Y 축 꺾은 선형 차트

Question

세 개의 꺾은 선형 차트가 혼합 된 차트가 있습니다. 차트 중 하나는 제안 된대로 "가짜"그룹을 사용하고 있습니다 here. 아래 차트에서 볼 수 있듯이 세 번째 차트의 눈금은 다른 두 차트와 매우 다릅니다. 내가 원하는 솔루션은 here in pure d3.과 같이 이중 축 차트를 사용하는 것입니다. 주 합성 차트에서 .renderlet()을 사용하여 수행 할 수 있다고 생각하지만 순수한 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]) 

Answer 1

예! 꽤 새로운 기능이며 직접 시도하지 않았지만 useRightYAxis으로 하위 차트를 만든 다음 합성 차트의 두 번째 눈금에 rightY을 설정하면 원하는 것을 얻을 수 있습니다.

그러나 이것은 완전히 흐릿 해지고 있으며 예제가 현재 깨져있는 것을 볼 수 있습니다 (web/examples/right-axis.html). 그러므로 문제가 생기면 creating an issue으로 연락하거나 토론을 시작하십시오. on the user group.