Vue module for Flexmonster Pivot Table & Charts

This repository holds the source code for using Flexmonster Pivot in Vue applications.

• Getting started
• Usage
• License
• Support & feedback

Getting Started

If you don’t have Vue app, you can create it by running in the console:

vue create my-app
cd my-app

Add Flexmonster Vue module by running in the console:

npm i vue-flexmonster --save

Usage

The Flexmonster Vue module can be used as a plugin or locally.

1) Use Flexmonster Vue module as a Vue plugin

1.1) Add the following lines to the main.js file:

import Pivot from "vue-flexmonster";
import 'flexmonster/flexmonster.css';

Vue.use(Pivot);

2) Register Flexmonster Vue module locally:

2.1) Import vue-flexmonster in App.js:

import {Pivot} from "vue-flexmonster";
import 'flexmonster/flexmonster.css';

2.2) Add the module to the components property in App.js:

export default {
  name: 'app',
  components: {
    Pivot
  }
}

After defining as a plugin or local component, use the module in <template></template> in App.js:

<template>
  <div id="app">
     <Pivot
      ref="pivot"
      v-bind:report="https://cdn.flexmonster.com/reports/report.json"
    ></Pivot>
  </div>
</template>

Run your application from the console:

npm run serve

To see the result open your browser on http://localhost:8080/.

License

Here is Flexmonster licensing page. We have a free 30-day trial!

Flexmonster Vue module is released as an MIT-licensed add-on to Flexmonster Pivot.

Support & feedback

Please share your feedback or ask questions via Flexmonster Forum.