DEV Community

Cover image for In-browser live Javascript chart editor using Vue.js
aclarembeau
aclarembeau

Posted on

1

In-browser live Javascript chart editor using Vue.js

Hi Dev community,

Today, I launched my first "in-browser live javascript chart editor".

It's a tool that will allow you, assuming you know a bit of Javascript and are used with some charting library (D3, C3 or Chart.js) to quickly build any kind of chart.

With this, say goodbye to long working hours playing with Google Sheets, Excel and other charting software. Use the tools that you already know: JavaScript.

https://aclarembeau.github.io/online-chart-tools/

Tell me what you think about it :)

How does it work?

  1. Get your data source (it can be anything, from CSV to JSON, or other)
  2. Parse and transform it using javascript
  3. Preview the output
  4. Make a D3 / C3 / Chart.js charting code
  5. Get it live, in your browser

Inspiration

The idea to build this tool came from the observation that many data analyst use tools such as matplotlib to make complex graphs out of local data. But, unfortunately, there is no such tool for Javascript developers. Moreover, most of these tools often require a local setup, which is not very fancy to maintain if you only want to build a few charts from time to time.

Use our Online chart tools from your browser instead.

Tech details

  • Built using Vue.js
  • Without backend
  • Published on Github Pages

AWS Q Developer image

Your AI Code Assistant

Generate and update README files, create data-flow diagrams, and keep your project fully documented. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

Top comments (0)

nextjs tutorial video

Youtube Tutorial Series ๐Ÿ“บ

So you built a Next.js app, but you need a clear view of the entire operation flow to be able to identify performance bottlenecks before you launch. But how do you get started? Get the essentials on tracing for Next.js from @nikolovlazar in this video series ๐Ÿ‘€

Watch the Youtube series

๐Ÿ‘‹ Kindness is contagious

Please leave a โค๏ธ or a friendly comment on this post if you found it helpful!

Okay