Description
Hi,
Thanks so much for your wonderful work with this package. I've managed to build some really nice dashboards with it. I've been using the scatterChart and managed to change the positions of the points by redefining the chart's dimension, redefining it's group, and calling the redraw method. I also managed to save the selection of the brushOn method and redraw it in the new coordinates, see below:
$('#dataset1_pcy').change(dataset1_pc_xy);
function dataset1_pc_xy (){
// column of new x coordinates in csv data file
var x = $('#dataset1_pcx').val();
// column of new y coordinates in csv data file
var y = $('#dataset1_pcy').val();
var filteredPCA = dataset1Dim.top(Infinity);
var new_pcx = filteredPCA.map(function(obj){return obj['dataset1_pc'+x]});
var new_pcy = filteredPCA.map(function(obj){return obj['dataset1_pc'+y]});
var resizeTimer2;
if(filteredPCA.length != 173 && filteredPCA.length != 0){
var new_pcx_max = Math.max.apply(null, new_pcx);
var new_pcx_min = Math.min.apply(null, new_pcx);
var new_pcy_max = Math.max.apply(null, new_pcy);
var new_pcy_min = Math.min.apply(null, new_pcy);
new_pcx_max = new_pcx_max + Math.abs(new_pcx_max)*.1;
new_pcx_min = new_pcx_min - Math.abs(new_pcx_min)*.1;
new_pcy_max = new_pcy_max + Math.abs(new_pcy_max)*.1;
new_pcy_min = new_pcy_min - Math.abs(new_pcy_min)*.1;
dataset1Dim.dispose();
dataset1Dim = ndx.dimension(function (d) {return [d['dataset1_pc' + x], d['dataset1_pc' + y]];});
countPerDataset1 = dataset1Dim.group().reduce(rAdd,rRemove,rInit);
dataset1Chart
.dimension(dataset1Dim)
.group(countPerDataset1)
.x(d3.scale.linear().domain([dataset1_pcs['min_pc' + x], dataset1_pcs['max_pc' + x]]))
.y(d3.scale.linear().domain([dataset1_pcs['min_pc' + y], dataset1_pcs['max_pc' + y]]))
.xAxisLabel(dataset1_pcs['var_pc' + x])
.yAxisLabel(dataset1_pcs['var_pc' + y])
.filter(null)
.filter(dc.filters.RangedTwoDimensionalFilter([[new_pcx_min, new_pcy_min], [new_pcx_max, new_pcy_max]]))
.redraw();
clearTimeout(resizeTimer2);
resizeTimer2 = setTimeout(function() {
dc.redrawAll();
}, 100)
My problem is, when I change the second / Y coordiantes so key[1] the redraw nicely moves each point with it's appropriate colours to its new position. But when I change the first / X coordinates (which is internally set as key[0]), the transition is all mixed up. What I mean is, all points end up where they should be, and all colours are right, the cross filtering with other charts works nicely as well but during the transition each point fades away and reappears from new places. I guess this is because the keys are internally sorted by key[0].
Is there any way to overcome this? I tried adding
function keyAcc(d) { return d.key[1]; };
function valAcc(d) { return d.key[0]; };
and then
.keyAccessor(keyAcc)
.valueAccessor(valAcc)
but it didn't work.
Thank a lot for your help in advance!