2017-02-15 65 views
1

我有一個由條形圖和散點圖組成的複合圖表。儘管啓用了刷牙功能,但我想顯示散點圖數據點。在畫筆頂部顯示數據點

在當前行爲中,刷牙將覆蓋數據點工具提示。任何幫助來滿足這一要求?

scatterChart 
    .width(380) 
    .height(200) 
    .margins({ 
    top: 10, 
    right: 20, 
    bottom: 30, 
    left: 40 
    }) 
    .dimension(scatterDimension) 
    .group(scatterGrouping) 
    .x(d3.scale.linear().domain([0., 100.])) 
    .y(d3.scale.linear().domain([0., 100.])) 
    .renderHorizontalGridLines(true) 
    .renderVerticalGridLines(true) 
    .symbolSize(5) 
    .highlightedSize(8) 
    //.brushOn(false) 
    .existenceAccessor(function(d) { 
    return d.value > 0; 
    }) 
    .colorAccessor(function(d) { 
    return d.key[2]; 
    }) 
    .colors(fruitColors) 
    .filterHandler(function(dim, filters) { 
    // https://jsfiddle.net/gordonwoodhull/c593ehh7/5/ 
    if (!filters || !filters.length) 
     dim.filter(null); 
    else { 
     // assume it's one RangedTwoDimensionalFilter 
     dim.filterFunction(function(d) { 
     return filters[0].isFiltered([d[0], d[1]]); 
     }) 
    } 
    }); 

叉形實施例 - http://jsfiddle.net/81mzjkjz/37/

回答

1

默認dc.js把刷層在一切的前方,這樣它會攔截所有點擊。如果你能夠將鼠標懸停在點上,你也可以點擊它們,這意味着如果你不小心在點上刷牙,刷牙將不會發生。

但是,如果你願意承擔這種風險,你可以刷移動到其兄弟姐妹這樣的背:

scatterChart.on('pretransition', function(chart) { 
    var brushNode = chart.select('g.brush').node(); 
    var firstChild = brushNode.parentNode.firstChild; 
    if (firstChild) { 
    brushNode.parentNode.insertBefore(brushNode, firstChild); 
    } 
}); 

我還沒有研究是否有可能讓點擊經歷徘徊在他們身上的點。我的猜測是,這很難得到正確的。

你撥弄叉(謝謝!):http://jsfiddle.net/gordonwoodhull/sajwjv7n/3/

+0

它的偉大工程,感謝戈登 – user3559365