nodegui / react-nodegui

Build performant, native and cross-platform desktop applications with native React + powerful CSS like styling.🚀
https://react.nodegui.org
MIT License
6.18k stars 171 forks source link

Pie Chart #339

Open Sydney-o9 opened 3 years ago

Sydney-o9 commented 3 years ago

Hi there,

Outstanding work - easy to set up and get started.

Would you be able to provide a bit of guidance as to how to create a Pie Chart?

image

I'd know how to do it in the browser, but how does it work in this scenario?

Thank you!

MistahMojo commented 3 years ago

Hi - under the hood the project uses Qt widgets instead of HTML.

A quick search on the Qt Docs yields the following Qt display classes: https://doc.qt.io/qt-5/qml-qtcharts-pieseries.html https://doc.qt.io/qt-5/qpieseries.html https://doc.qt.io/qt-5/qpieslice.html

And a tutorial: https://doc.qt.io/archives/qt-5.11/qtcharts-piechart-example.html

These will need to be added into the core NodeGui before React components can be built on top of them. This is a lot of work!

But remembering that all React-Nodegui projects are still valid Node projects, it might be worth looking into D3 Charts (or another charting library). There's a nice example there about using node-canvas to generate a png, which you can then just insert as a normal image. Should be good as a workaround.