New Brython package "brycharts" for statistical charts - suggestions welcome

[Andy Lewis]

Hello again

I have made a start on a new package called brycharts for adding statistical charts (pie charts, bar charts, scattergraphs, histograms etc) to web pages using Brython.

The package is at https://github.com/andy31lewis/brycharts

A "Hello World" pie chart created with a 4-line Brython script is at http://mathsanswers.org.uk/oddments/brycharts/helloworld.html

And lots more examples using real-life data at http://mathsanswers.org.uk/oddments/brycharts/demo.html

This is by no means finished (in particular documentation is at an early stage) but I wanted to make it available so that people can make suggestions about other types of graph they would like to see, options to change the look of graphs, etc etc.

Here is the splash screen for the demo, which illustrates some of the types of graph available so far:

I'll be interested to see what suggestions people have...

Thanks

Andy

[Kiko]

2021-05-15 13:21 GMT+02:00, Andy Lewis <andy3...@gmail.com>:
>
> Hello again
>
> I have made a start on a new package called brycharts for adding
> statistical charts (pie charts, bar charts, scattergraphs, histograms etc)
> to web pages using Brython.

It is great. I did something similar in the past as a
proof-of-concept:
https://web.archive.org/web/20160426064213/https://bitbucket.org/kikocorreoso/brython-bryplot

>
> The package is at https://github.com/andy31lewis/brycharts
> A "Hello World" pie chart created with a 4-line Brython script is at
> http://mathsanswers.org.uk/oddments/brycharts/helloworld.html
> And lots more examples using real-life data at
> http://mathsanswers.org.uk/oddments/brycharts/demo.html
>
> This is by no means finished (in particular documentation is at an early
> stage) but I wanted to make it available so that people can make
> suggestions about other types of graph they would like to see, options to
> change the look of graphs, etc etc.
>
> Here is the splash screen for the demo, which illustrates some of the types
>
> of graph available so far:
> [image: splash.png]
> I'll be interested to see what suggestions people have...
>

Please, read this as constructive criticisms. I do not know your
motivations to make your own lib so some of my comments may seem rude
(and this is not the idea):
-The behabiour of the legend in piecharts can be improved.
-The fact that I can drag and drop everything is not useful as it is right now.
-Lack of interactivity. For most of the cases I can use a static image.
-Size of the lib is almost 80Kb with limited capacity. ChartJS is
around 180Kb with a lot of functionality/interactive charts/Big
community/examples/other plugins,... If your motivation is to learn
about data visualization (amazing field) this is a good exercise.
Matplotlib have a lot of interesting code to learn about how to
implement a lot of stuff. If your motivation is to provide a graph
library to brython, why not a wrapper for ChartJS, HighCharts,
plotlyJS, BokehJS,...? Again, I do not want to discourage you. It is
just curiosity. I did the same several years ago and it was an
interesting path to explore.

> Thanks

Thank you for sharing.

>
> Andy
>

[Andy Lewis]

Hello Kiko

Thank you for taking the time to look at the package and write your comments.  I do not think you are being rude! ;-)

I will try to reply each comment/question.

Firstly, my motivation is that I write the software I need for my own website.  I make it publicly available because it may be useful to other people as well. I decided about 8 years ago that I would switch to Brython from Javascript for the client-side scripts of my website, and have used it ever since.

-The behaviour of the legend in piecharts can be improved.

I'm not sure what you mean - could you be more specific?

-The fact that I can drag and drop everything is not useful as it is right now.

That was accidental! I have prevented them from being dragged now.

-Lack of interactivity. For most of the cases I can use a static image.

What interactivity would you like to see? For example, now if you hover over the points on the scattergraph demo, information about the point is displayed. Is that the type of thing you mean? Or something else?

Also, you couldn't use a static image if you were graphing real-time data.

-Size of the lib is almost 80Kb with limited capacity.

At this early stage I hadn't thought about the size. I had a quick look and reduced it to 64Kb, with a bit more thought it could be smaller, maybe 50Kb.

-why not a wrapper for ChartJS, HighCharts, plotlyJS, BokehJS,...?

I don't know those packages; also I try to keep my website pure-Brython so far as possible.

After your suggestion I had a look at ChartJS, but it doesn't seem to do Histograms or Cumulative Frequency Graphs, which I need. (The graphs I have included so far are the ones I need, which are those taught in schools in the UK.  If anyone requests other types, I will add them.)

In any case it would probably have taken me longer to write wrappers round ChartJS functions than write my own code, since I already had a lot of the underlying code written for other projects.

Bit I agree that probably most other people would find those packages more useful.

Thank you again for your reply - I look forward to reading any other comments you make.

Andy

[Kiko]

2021-05-17 17:52 GMT+02:00, Andy Lewis <andy3...@gmail.com>:
> Hello Kiko
>
> Thank you for taking the time to look at the package and write your
> comments. I do not think you are being rude! ;-)
> I will try to reply each comment/question.
>
> Firstly, my motivation is that I write the software I need for my own
> website. I make it publicly available because it may be useful to other
> people as well. I decided about 8 years ago that I would switch to Brython
> from Javascript for the client-side scripts of my website, and have used it
>
> ever since.
>

> *-The behaviour of the legend in piecharts can be improved. *

> I'm not sure what you mean - could you be more specific?

It was related with the next comment (drag&drop). I can drag and drop
the elements of the legend but there was a problem with "undrag" the
element.

>
> *-The fact that I can drag and drop everything is not useful as it is right
>
> now. *

> That was accidental! I have prevented them from being dragged now.
>

I think is is better like this.

> *-Lack of interactivity. For most of the cases I can use a static image. *

> What interactivity would you like to see? For example, now if you hover
> over the points on the scattergraph demo, information about the point is
> displayed. Is that the type of thing you mean? Or something else?
> Also, you couldn't use a static image if you were graphing real-time data.
>

Simple stuff like what you can see when you use bokeh or plotly, zoom,
pan, home (back to the original plot), tooltips with the value of the
data (columns, scatter,...).

> *-Size of the lib is almost 80Kb with limited capacity.*

> At this early stage I hadn't thought about the size. I had a quick look and
>
> reduced it to 64Kb, with a bit more thought it could be smaller, maybe
> 50Kb.

This is not a problem itself. I was just wondering that maybe the less
resistance path would be to reuse one of the established libs and
use/wrap only what you need. It will be lighter (from the brython
perspective) but you add new dependencies (and it could result in more
size).

>
> *-why not a wrapper for ChartJS, HighCharts, plotlyJS, BokehJS,...?*

> I don't know those packages; also I try to keep my website pure-Brython so
> far as possible.
> After your suggestion I had a look at ChartJS, but it doesn't seem to do
> Histograms or Cumulative Frequency Graphs, which I need. (The graphs I have
>
> included so far are the ones I need, which are those taught in schools in
> the UK. If anyone requests other types, I will add them.)
> In any case it would probably have taken me longer to write wrappers round
> ChartJS functions than write my own code, since I already had a lot of the
> underlying code written for other projects.

Yes, this is one of the hidden stuff I do not see when I was thinking
in constructive criticism. It has sense to reuse your own code.

> Bit I agree that probably most other people would find those packages more
> useful.

If Brycharts is useful for you for sure it will be useful for others.

Keep the good work and thanks for sharing it!!!!

> --
> You received this message because you are subscribed to the Google Groups
> "brython" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to brython+u...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/brython/f227f42e-352e-492e-b5cc-618caa11208en%40googlegroups.com.
>

[Ray Luo]

Thank you, Andy and Kiko, for sharing your journey.

Andy's bryCharts is probably built on top of his brySVG. That is presumably why its size starts at 50KB~80KB range. That size shouldn't be an issue, considering that more and more features might be added into bryCharts. The underlying brySVG is just so versatile. Anything is possible.

Kiko's bryplot was also intriguing. Those screenshots were attractive! bryplot was seemingly built with HTML5 canvas technology. I ended up reading a couple articles here and there to learn the difference between the svg and canvas technology. #LearnSomethingNewEveryday  I haven't looked into the implementation of other established JS-powered chart libraries. Do they all choose the HTML5 canvas route? And, was that the reason Kiko discontinued the development of bryplot?

Regards,

Ray Luo

[Kiko]

2021-05-17 20:10 GMT+02:00, Ray Luo <raylu...@gmail.com>:
> Thank you, Andy and Kiko, for sharing your journey.
>
> Andy's bryCharts is probably built on top of his brySVG. That is presumably
>
> why its size starts at 50KB~80KB range. That size shouldn't be an issue,
> considering that more and more features might be added into bryCharts. The
> underlying brySVG is just so versatile. Anything is possible.
>
> Kiko's bryplot was also intriguing. Those screenshots were attractive!
> bryplot was seemingly built with HTML5 canvas technology. I ended up
> reading a couple articles here

> <https://css-tricks.com/when-to-use-svg-vs-when-to-use-canvas/> and there
> <https://www.sitepoint.com/canvas-vs-svg/> to learn the difference between

> the svg and canvas technology. #LearnSomethingNewEveryday I haven't looked
>
> into the implementation of other established JS-powered chart libraries. Do
>
> they all choose the HTML5 canvas route? And, was that the reason Kiko
> discontinued the development of bryplot?

Bryplot was a proof of concept. Also, lack of time (second baby arrived),... :-)

> https://groups.google.com/d/msgid/brython/9d0818bc-5ba1-4984-b5d6-d31cf1c03108n%40googlegroups.com.
>

[Andy Lewis]

Kiko wrote:

>>>What interactivity would you like to see?

>>Simple stuff like what you can see when you use bokeh or plotly, zoom,
>> pan, home (back to the original plot), tooltips with the value of the
>> data (columns, scatter,...).

Thank you, these are helpful suggestions.

I have implemented zoom, pan and home:

Zoom with a mouse using the wheel, or on touchscreen using two fingers.
Pan by dragging with mouse or one finger

Home by double-clicking or double tapping

And tooltips for pie charts, bar charts, line graphs and scattergraphs (so far). To see them, hover with a mouse, or tap if using touchscreen.

If you have time, it would be helpful if you could take another look at the demo and check that these are the sort of thing you were looking for, and see whether you have any more suggestions.

Ray Luo wrote:

> Andy's bryCharts is probably built on top of his brySVG. That is presumably

> why its size starts at 50KB~80KB range. That size shouldn't be an issue...

That's right, it is built on brySVG. The size has gone back up temporarily, because it is easier to work with the whole of brySVG while developing; I can remove the bits of brySVG which are not needed for brycharts when things reach a more stable state.

Thank you for the interest - as I say, I made it public at an early stage hoping to get suggestions of what features should be included.

Andy

[Jurgis Pralgauskis]

I also stumbled upon more scientific (more display options at least) https://visualife.readthedocs.io/