CODEWITHSUNDEEP
d3.jsdimple.js
As3adTintin
As3adTintin

Reputation: 2476

Dimple Filter for X Value

I've been using a little d3 and am now exploring dimple. I am trying to create some pie charts. However, I want the x-axis value to be a subset of the actual values.

Here's what I have:

    var svg = dimple.newSvg("body", 800, 600);

//data
    var data = [{"Inst":"Two", "Finaid":"Grant", "Value":50},
                {"Inst":"Two","Finaid":"None", "Value":10},
                {"Inst":"Two","Finaid":"No", "Value": 30},
                {"Inst":"One", "Finaid":"Grant", "Value":20},
                {"Inst":"One","Finaid":"None", "Value":10},
                {"Inst":"One","Finaid":"No", "Value": 30}];

//basic chart
    var chart = new dimple.chart(svg, data);
    console.log(data);
    chart.setBounds(50,20,460,360)
    chart.addCategoryAxis("y", "Inst")
    chart.addMeasureAxis("x", "Value");
    chart.addMeasureAxis("p", "Value");
    chart.addMeasureAxis("z", "Value");
    chart.addSeries("Finaid", dimple.plot.pie);
    chart.addLegend(600,20,90,300, "left");
    chart.draw();

So this works, but I want the x-axis value to only be the value of "Finaid":"Grant" something like chart.addMeasureAxis("x", {"Finaid":"Grant"}.Value);... although I realize that actual code does nothing.

Any suggestions? Thanks

Upvotes: 0

Views: 931

Answers (1)

Mark
Mark

Reputation: 108537

Just filter it before plotting. In fact, dimple.js even offers a helpful function for just that.

var data = [{"Inst":"Two", "Finaid":"Grant", "Value":50},
            {"Inst":"Two","Finaid":"None", "Value":10},
            {"Inst":"Two","Finaid":"No", "Value": 30},
            {"Inst":"One", "Finaid":"Grant", "Value":20},
            {"Inst":"One","Finaid":"None", "Value":10},
            {"Inst":"One","Finaid":"No", "Value": 30}];

var filteredData = dimple.filterData(data, "Finaid", "Grant");

// now make chart
var chart = new dimple.chart(svg, filteredData);

Upvotes: 1

Related Questions