vue-chart-engine

vue-chart-engine

chart components built with Vue.js.

This repository contains a set of native Vue.js components based on chart engine(AnyChart,HighChart,EChart etc). As a result no dependency on jQuery is required. The only required dependencies are:

• Vue.js.

Installation

NPM

$ npm install vue-chart-engine

CommonJS

var engine = require('vue-chart-engine').engine;

new Vue({
  components: {
    'engine': engine
  }
})

ES6

import engine from 'vue-chart-engine/src/Home'
// or
import { engine } from 'vue-chart-engine'

new Vue({
  components: {
    engine
  }
})

AMD

define(['vue-chart-engine'], function(VueStrap) { var engine = VueChartEngine.engine; ... });

Browser globals

The dist folder contains vue-chart-engine.js and vue-chart-engine.min.js with all components exported in the window.VueChartEngine object. These bundles are also available in, and on both the Bower and NPM packages.

<div id="container" style="height:300px;width:50%"></div>
<engine :branch="currentBranch" :genre="currentGenre" :data-init="msg"  :container="container"></engine>
<script src="path/to/vue.js"></script>
<script src="path/to/vue-chart-engine.js"></script>
<script>
      var vm = new Vue({
          components: {
              engine: VueChartEngine.engine
          },
          el: "body",
          data: {
             currentBranch: 'HighChart',
             currentGenre: "area_basic",
             msg0:[
              ["January", 10000],
              ["February", 12000],
              ["March", 18000],
              ["April", 11000],
              ["May", 9000]
            ],
              msg:[ 
              ["January", 10000,8999],
              ["February", 12000,10000],
              ["March", 18000,5555],
              ["April", 11000,6666],
              ["May", 9000,7777]
            ],
            container:"container"
          }
      })
</script>

Local Setup

• Install with npm install
• Run the docs site in development mode with npm run docs. This will watch for file changes as you work.
• Build with npm run build.

License

vue-chart-engine is licensed under The MIT License.