DC.JS 원형 차트 + 외부 JavaScript 함수에서 선택 선택

Question

d3j 및 교차 필터의 래퍼 인 dc.js (http://dc-js.github.io/dc.js/)를 사용하고 있습니다. 외부에서 dc.js의 pieChart를 클릭하고 싶습니다.

http://jsfiddle.net/nishants/Bra2H/47/

var hitslineChart = dc.lineChart("#chart-line-hitsperday"); 

var data = [ 
     {date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100}, 
     {date: "12/28/2012", http_404: 2, http_200: 10, http_302: 100}, 
     {date: "12/29/2012", http_404: 1, http_200: 300, http_302: 200}, 
     {date: "12/30/2012", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "12/31/2012", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/01/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/02/2013", http_404: 1, http_200: 10, http_302: 1}, 
     {date: "01/03/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/04/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/05/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/06/2013", http_404: 2, http_200: 200, http_302: 1}, 
     {date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100} 
     ]; 
var ndx = crossfilter(data); 
var parseDate = d3.time.format("%m/%d/%Y").parse; 
data.forEach(function(d) { 
    d.date = parseDate(d.date); 
    d.total= d.http_404+d.http_200+d.http_302; 
    d.Year=d.date.getFullYear(); 
}); 

var dateDim = ndx.dimension(function(d) {return d.date;}); 
var hits = dateDim.group().reduceSum(function(d) {return d.total;}); 
var minDate = dateDim.bottom(1)[0].date; 
var maxDate = dateDim.top(1)[0].date; 

hitslineChart 
    .width(500).height(200) 
    .dimension(dateDim) 
    .group(hits) 
    .x(d3.time.scale().domain([minDate,maxDate])) 
    .brushOn(false) 
    .yAxisLabel("Hits per day"); 

var yearRingChart = dc.pieChart("#chart-ring-year"); 
var yearDim = ndx.dimension(function(d) {return +d.Year;}); 
var year_total = yearDim.group().reduceSum(function(d) {return d.http_200+d.http_302;}); 

yearRingChart 
.width(150).height(150) 
.dimension(yearDim) 
.group(year_total) 
.innerRadius(30); 

dc.renderAll(); 

내가 클릭하거나 widgtes을 dc.js를 외부에 크로스 필터 코드를 호출 할 수있는 방법을 찾을 수 없습니다.

Answer 1

dc.js 소스를 보면 클릭 수는 _onClick 처리기의 차트 수준에서 처리됩니다. 그래서 저는 이것을 명시 적으로 부릅니다. 당신은 당신의 "클릭"하는 데이터 요소에 통과해야합니다 :

yearRingChart._onClick(yearRingChart.data()[0]); 

는 example 업데이트되었습니다.

또 다른 아이디어는 필터를 사용하는 것입니다

Answer 2

...

HTML

<button type="button" class="btn btn-primary" onclick=filter1()>Date Filter</button> 

JS

function filter1() { 
    yearRingChart.filter('2014'); 
    dc.redrawAll(); 
};