Regeneration of chart

[petertkim]

  var chart = visavailChart().width(800);
  d3.select("#example")
          .datum(dataset)
          .call(chart);

Hi All,

Is there a way to make this snippet of code (which generates the chart) simply replace the chart instead of creating an additional chart underneath it?

I want to change what measures are included in the chart and then regenerate the chart anew, replacing the old one, but when I click my button that contains this code it just generates additional charts underneath the original.

Thanks in advance for your help!

-Peter

[petertkim]

I think I have found it. FYI it is:

  d3.select("#example").html(null);

  d3.select("#example")
          .datum(dataset)
          .call(chart);

[vikrambansod]

Hi peter,

So basically with this solution you are able to update the chart dynamically and replacing existing state of the chart ?

Is there any way to update chart dynamically as per the new dataset?

Thank in advance.

Regards, Vikram.

On Wed, 18 Jul 2018 at 2:33 AM, petertkim notifications@github.com wrote:

I think I have found it. FYI it is:

d3.select("#example").html(null);

d3.select("#example") .datum(dataset) .call(chart);

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/flrs/visavail/issues/28#issuecomment-405727115, or mute the thread https://github.com/notifications/unsubscribe-auth/AdrBSXwhRMQcr-9xVKKzuDs96nd_zrC4ks5uHlEbgaJpZM4VTbmV .

-- Sent from MetroMail

[tanganellilore]

Hi @petertkim, I create a fork of Visavail with some enhancement. With the @flrs contribute in the next week we update the linrary and documentation with the new functionality.

The new library have the function for update the chart (with old data or new data) and functionaliti to resize, zoomming etc.

[petertkim]

Hi @vikrambansod , yes sorry my original 'solution' does not actually update the chart, but fixes the regeneration problem that created duplicate charts.

Hi @tanganellilore ,

Thank you! So you expect for the enhancement to be ready sometime next week? The ability to update the chart with new data is exactly what I am looking for! Resize and zoom sounds great too.

Can you let me know when it is ready and where I can access it?

Thanks very much.

-Peter

[flrs]

@petertkim, you can follow the progress of the enhancement in #25

[petertkim]

Hi everyone,

I am running into a weird issue with my website where, if a measure (device in my case) has a schedule in which it has multiple actions (e.g. water_tank_2 heat 6-10am, and heat 6-8pm) when I click my button that is supposed to filter the Device Schedule chart it connects these 2 actions into one, so that there is no empty space between the bars.

Here is the link to my site: http://ec2-18-191-81-148.us-east-2.compute.amazonaws.com/~petertkim/SDSP/visualSchedule/alldevices_actionsJSON.html

and here is how I am regenerating the chart when the 'water_tank' button is pressed:

var datNew = [] for (var i=0; i<dataset.length; i++) { if (dataset[i].measure.includes('water_tank')) { datNew.push(dataset[i]); } } // draw Visavail.js chart var chart = visavailChart().width(800); d3.select("#example").html(null); d3.select("#example") .datum(datNew) .call(chart);

where 'dataset' is my original array I use to create the original visavail chart.

Please help! Thank you in advance!

-Peter

[tanganellilore]

@petertkim in my fork already exist the function to update the graph with new dataset!. flrs working for create new documentation and I try to help him to update the documentation.

you can follow the progress of the enhancement in #25

Good day

[petertkim]

@tanganellilore thank you!

Where exactly can I clone the repo with your enhancement? Sorry for so many questions.

Actually, it is this one right? https://github.com/tanganellilore/visavail

Thanks.

[petertkim]

@tanganellilore Thank you for your enhancement!

Since there is not yet the documentation, can you help me with how to update the graph with the new dataset? Is there a specific function call?

Also, can you direct me to where/how I can change the width of the chart? And perhaps how to change the time steps on the x axis? (e.g. 12 am, 3am, 6am... --> 12am, 2am, 4am, 6am...).

Thanks very much!

-Peter

[tanganellilore]

Hi @petertkim ,

today I have adding some example in my git of visavail, under folder "docs".

Follow the exaple for use the new functionality. The Readme file and text documentation coming soon.

Good day

[tanganellilore]

Hi @petertkim,

today we merged my fork with flrs github. So now the origina library have all my enahcment.

Enjoy with visavail 2.0