Discussion on using plotly

[IshaGupta18]

@jywarren @namangupta01 @Souravirus @IgorWilbert @gauravano do you think it will be a good idea to switch to plotly instead of chart.js because of its better UI, zooming, panning here
https://plot.ly/javascript/
This might ease us out on a lot of stuff for us with a better range of features. What do you all think?

[namangupta01]

Yes, this new chat looks nice and also provide various inbuilt functionality. Like download as image, zooming and all. It looks good. But we should consider all aspects before moving to this one. Let's take what others think about it. In the meantime, I am exploring more about this Plotly.

[IshaGupta18]

Yes! I think it has great functionality but let's see if it doesn't harm any of the other functioning. I am exploring this one too and if we get an upvote for it, we will shift to it!

[IshaGupta18]

@Souravirus agreed with this on #31. What do the others think about this?

[IgorWilbert]

@IshaGupta18 good find! I guess the replace depends on what people want for the project. Using plotly may save us work since they have so many different types of graphs ready to use. However, we would lose a bit of flexibility to make custom graphs, essentially just applying those types. Since I think your end goal is to work on CSV compatibility, I vote for plotly, as long as you don't lose much of what you already did.

[jywarren]

Hi! If you want to abstract the display portion of the library, you can plan to make it possible to hand data off to either library using an adaptor function. Like, the standard data could go out to display(chartLib, data) where chartLib is either chart.js or Plotly.... could that work?

[IshaGupta18]

That would be a great idea! Actually we will just have one function (or a set of 2-3 functions) and use them for the plotting part, which involves the libraries. The rest of the code will stay put. However it won't be an easy task as the code is written, keeping in mind the structure of chart.js, so we will need to do something similar for plotly.js, and then think of how to structure the adopter function. But do you think we should try out plotly.js and then think of how to preserve both the codes? Do you upvote for it or do you think we should try and expand chart.js?

…

On Tue, Jun 11, 2019, 9:32 PM Jeffrey Warren ***@***.***> wrote: Hi! If you want to abstract the display portion of the library, you can plan to make it possible to hand data off to either library using an adaptor function. Like, the standard data could go out to display(chartLib, data) where chartLib is either chart.js or Plotly.... could that work? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#34?email_source=notifications&email_token=AJXHQZ6PHNNHYDFRFEU32P3PZ7D7ZA5CNFSM4HVZXGI2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODXNUKNQ#issuecomment-500909366>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AJXHQZ3GYUOJXV7WHWKJN5DPZ7D7ZANCNFSM4HVZXGIQ> .

[IshaGupta18]

https://code.tutsplus.com/tutorials/create-interactive-charts-using-plotlyjs-getting-started--cms-29029 lists why we should use plotly!

[IshaGupta18]

So any conclusion we may have drawn out on this one? @jywarren what do you think?

[jywarren]

Hi @IshaGupta18 - to be honest, i trust you to make the call! What I would do is think about what is the common API a swappable generic graph library would need. Would it be:

1. grapher.load(data) => accepts data
2. grapher.render(element) => generates HTML
3. grapher.update(data) => updates HTML
4. ...?

This kind of approach helps design any component in your system. And, the input/output of each of these methods could be testable too.

[IshaGupta18]

Yes agreed. I'll try to structure the code accordingly. I'll keep you posted on how I will be going about it!

[IshaGupta18]

@jywarren I have implemented plotly in our project, I will be pushing the code in the adopter function form you suggested.

Here's a gif of how it works and a couple of images!

We can easily shift between the 2 libraries, and I will show you the code to make it more clear! What do you think?

cc @namangupta01 @IgorWilbert @gauravano @Souravirus

[jywarren]

This is AWESOME!

…

On Thu, Jun 20, 2019 at 3:22 PM Isha Gupta ***@***.***> wrote: @jywarren <https://github.com/jywarren> I have implemented plotly in our project, I will be pushing the code in the adopter function form you suggested. Here's a gif of how it works and a couple of images! [image: plotly] <https://user-images.githubusercontent.com/40794215/59875476-7a833800-93be-11e9-9bf5-c98aec60e36e.gif> [image: image] <https://user-images.githubusercontent.com/40794215/59875481-7eaf5580-93be-11e9-94cf-4589996fbee9.png> [image: image] <https://user-images.githubusercontent.com/40794215/59875504-8ff86200-93be-11e9-8cde-95bce359b906.png> [image: image] <https://user-images.githubusercontent.com/40794215/59875514-98e93380-93be-11e9-93fb-45024cfa1a6c.png> We can easily shift between the 2 libraries, and I will show you the code to make it more clear! What do you think? cc @namangupta01 <https://github.com/namangupta01> @IgorWilbert <https://github.com/IgorWilbert> @gauravano <https://github.com/gauravano> @Souravirus <https://github.com/Souravirus> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#34?email_source=notifications&email_token=AAAF6JY5NYPCDFNE7RW676LP3PKEHA5CNFSM4HVZXGI2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYGLUCY#issuecomment-504150539>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J3QPMCRPYTA4IY6QS3P3PKEHANCNFSM4HVZXGIQ> .

[IshaGupta18]

Thanks a lot! I'll be pushing the code very soon! On Fri, Jun 21, 2019, 1:27 AM Jeffrey Warren <[email protected]> wrote:

…

This is AWESOME! On Thu, Jun 20, 2019 at 3:22 PM Isha Gupta ***@***.***> wrote: > @jywarren <https://github.com/jywarren> I have implemented plotly in our > project, I will be pushing the code in the adopter function form you > suggested. > > Here's a gif of how it works and a couple of images! > > [image: plotly] > < https://user-images.githubusercontent.com/40794215/59875476-7a833800-93be-11e9-9bf5-c98aec60e36e.gif > > [image: image] > < https://user-images.githubusercontent.com/40794215/59875481-7eaf5580-93be-11e9-94cf-4589996fbee9.png > > [image: image] > < https://user-images.githubusercontent.com/40794215/59875504-8ff86200-93be-11e9-8cde-95bce359b906.png > > [image: image] > < https://user-images.githubusercontent.com/40794215/59875514-98e93380-93be-11e9-93fb-45024cfa1a6c.png > > > We can easily shift between the 2 libraries, and I will show you the code > to make it more clear! What do you think? > > cc @namangupta01 <https://github.com/namangupta01> @IgorWilbert > <https://github.com/IgorWilbert> @gauravano < https://github.com/gauravano> > @Souravirus <https://github.com/Souravirus> > > — > You are receiving this because you were mentioned. > Reply to this email directly, view it on GitHub > < #34?email_source=notifications&email_token=AAAF6JY5NYPCDFNE7RW676LP3PKEHA5CNFSM4HVZXGI2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYGLUCY#issuecomment-504150539 >, > or mute the thread > < https://github.com/notifications/unsubscribe-auth/AAAF6J3QPMCRPYTA4IY6QS3P3PKEHANCNFSM4HVZXGIQ > > . > — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#34?email_source=notifications&email_token=AJXHQZ23RDQ3U2GY63ZNJD3P3POI7A5CNFSM4HVZXGI2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYGOGSA#issuecomment-504161096>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AJXHQZ2FZRQYJ5ZZ3QP6K23P3POI7ANCNFSM4HVZXGIQ> .