lauecharts

lauecharts

Forked from QingWei-Li/laue

🖖📈 Modern charts for Vue.js

Documentation: https://laue.js.org

Features

• It depends on several small submodules in D3, so it's very reliable and lightweight.
• The implementation for Vue.js, so it is composable and supports SSR.

Installation

npm i fwiwDev/lauecharts

Usage

import Vue from 'vue'
import { Laue } from 'lauecharts'

Vue.use(Laue)

// On demand
import { Cartesian, Line } from 'lauecharts'

Vue.component(Cartesian.name, Cartesian)
Vue.component(Line.name, Line)

Demo

A dead simple example

<div id="app">
  <la-cartesian :width="300" :height="150" :data="values">
    <la-line prop="pv"></la-line>
    <la-y-axis></la-y-axis>
    <la-x-axis prop="name"></la-x-axis>
    <la-tooltip></la-tooltip>
  </la-cartesian>
</div>

<script src="//unpkg.com/vue"></script>
<script src="//unpkg.com/laue"></script>
<script>
  new Vue({
    el: '#app',
    data: () => ({
      values: [
        { name: 'Page A', pv: 2000 },
        { name: 'Page B', pv: 3000 },
        { name: 'Page C', pv: 1200 },
      ],
    }),
  })
</script>

Inspired

• Recharts
• Frappe Charts

License

MIT