Skip to content
forked from QingWei-Li/laue

πŸ––πŸ“ˆ Modern charts for Vue 2.0

License

Notifications You must be signed in to change notification settings

fwiwDev/lauecharts

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

lauecharts

Forked from QingWei-Li/laue

npm

πŸ––πŸ“ˆ 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

License

MIT

About

πŸ––πŸ“ˆ Modern charts for Vue 2.0

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 84.6%
  • Vue 7.3%
  • Stylus 7.1%
  • Shell 1.0%