CODEWITHSUNDEEP
javascriptjquerygraphflot
Christopher
Christopher

Reputation: 29

Flot Sum Bar Chart Data from X Range

Referring to this fiddle: http://jsfiddle.net/chrisgzf/KMQcs/#base

I am trying to plot a bar chart with 31 days data with 2 jQuery UI sliders to interact with the selection plugin of Flot. For the slider on the horizontal axis how do I sum up all the graph values within a certain x range? For example, when my slider is on 3 and 9 I will want to sum up the values between 3 and 9. How do I write that in jquery/javascript?

For now, I have this

$("#placeholder").bind("plotselected", function(event, ranges) {
    var first = Math.round(ranges.xaxis.from.toFixed(1));
    var second = Math.round(ranges.xaxis.to.toFixed(1));
    var difference = second - first;
    var series = plot.getData();

    $("#topBox").text("From August " + first + " to August " + second + ", you have used " + difference * getRandomInt(1200, 1800) + "kWh of electricity.");
    // how do i sum up the values from a certain range??
    $("#btmBox").text("The highlighted area on the y-axis represents " + (ranges.yaxis.to.toFixed(1) - ranges.yaxis.from.toFixed(1)) + "kWh");
});

Upvotes: 0

Views: 931

Answers (1)

Rob
Rob

Reputation: 919

Do you mean like this?

var plotData = series[0].data;
var sum = 0;
for (var i = first; i < second; i++)
    sum += plotData[i-1][1];
$("#sum").html(sum);

Take a look at your modified fiddle: http://jsfiddle.net/KMQcs/8/ Just move the horizontal slider.

Upvotes: 2

Related Questions