Find Jobs
Hire Freelancers

Reset bar graph in JS

$10-30 USD

Completed
Posted over 6 years ago

$10-30 USD

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.//
Project ID: 15695072

About the project

3 proposals
Remote project
Active 6 yrs ago

Looking to make some money?

Benefits of bidding on Freelancer

Set your budget and timeframe
Get paid for your work
Outline your proposal
It's free to sign up and bid on jobs
Awarded to:
User Avatar
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 day
5.0 (11 reviews)
4.0
4.0
3 freelancers are bidding on average $18 USD for this job
User Avatar
A proposal has not yet been provided
$25 USD in 1 day
5.0 (2 reviews)
2.1
2.1
User Avatar
Can do it in less than an hour Stay tuned, I'm still working on this proposal.
$15 USD in 1 day
0.0 (0 reviews)
0.0
0.0

About the client

Flag of UNITED STATES
Tampa, United States
0.0
0
Payment method verified
Member since Nov 17, 2017

Client Verification

Thanks! We’ve emailed you a link to claim your free credit.
Something went wrong while sending your email. Please try again.
Registered Users Total Jobs Posted
Freelancer ® is a registered Trademark of Freelancer Technology Pty Limited (ACN 142 189 759)
Copyright © 2024 Freelancer Technology Pty Limited (ACN 142 189 759)
Loading preview
Permission granted for Geolocation.
Your login session has expired and you have been logged out. Please log in again.