Reset bar graph in JS

In Progress Posted 6 years ago Paid on delivery
In Progress Paid on delivery

Hello, I am trying to figure out the last piece of this puzzle - creating an init function. I need to reset the bar graph to 0 in this script.

function createBarChart (data) {

// Start with the container.

var chart = [login to view URL]("div");

// The container must have position: relative.

[login to view URL] = "relative";

// The chart's height is the value of its largest

// data item plus a little margin.

var height = 0;

for (var i = 0; i < [login to view URL]; i += 1) {

height = [login to view URL](height, data[i].value);

}

[login to view URL] = (height + 50) + "px";

// Give the chart a bottom border.

[login to view URL] = "dotted"; //change to solid?

[login to view URL] = "5px";

[login to view URL] = "leftt";

// Iterate through the data.

var barPosition = 0;

// We have a preset bar width for the purposes of this

// example. A full-blown chart module would make this

// customizable.

var barWidth = 50;

for (i = 0; i < [login to view URL]; i += 1) {

// Basic column setup.

var dataItem = data[i];

var bar = [login to view URL]("div");

[login to view URL] = "absolute";

[login to view URL] = barPosition + "px";

[login to view URL] = barWidth + "px";

[login to view URL] = [login to view URL];

[login to view URL] = [login to view URL] + "px";

[login to view URL] = "ridge";

[login to view URL] = [login to view URL];

// Recall that positioning properties are treated *relative*

// to the corresponding sides of the containing element.

[login to view URL] = "0px";

[login to view URL](bar);

// Move to the next bar. We provide an entire bar's

// width as space between columns.

barPosition += (barWidth * 2);

}

return chart;

};

[login to view URL] = function reset() {

var colors = [{ color: "orange", value: 0 },

{ color: "white", value: 0 },

{ color: "red", value: 0 },

{ color: "yellow", value: 0 },

];

var chart = createBarChart(colors);

[login to view URL](chart);

}

[login to view URL] = function () {

var colors = [{ color: "orange", value: 40 },

{ color: "white", value: 10 },

{ color: "red", value: 100 },

{ color: "yellow", value: 65 },

];

//You can't have to functions assigned to the onload event in the same script. Create an init function and assign that to onload. In the init function create the graph and create the event listener for reset. To reset the graph, all you need to do is see the values for the data to 0 and recall the function with the new data.//

CSS Dthreejs HTML JavaScript jQuery / Prototype

Project ID: #15695072

About the project

3 proposals Remote project Active 6 years ago

Awarded to:

diegofpr

Hi, it seems that you are not resetting the chart, just recreating it. Would you care to provide your full HTML, and which chart are you using (chartjs, ?perhaps?), so I can assess the issue further?

$15 USD in 0 days
(11 Reviews)
4.0

3 freelancers are bidding on average $18 for this job

WhatTechnologies

A proposal has not yet been provided

$25 USD in 1 day
(2 Reviews)
2.1
IoanAdrian98

Can do it in less than an hour Stay tuned, I'm still working on this proposal.

$15 USD in 1 day
(0 Reviews)
0.0