Cube is visualization-agnostic, so you can build any user interface for your application.
The client has methods to communicate with Cube API Gateway and retrieve and process data. It is designed to work with existing charting libraries including Chart.js, D3.js, and more.
The client provides methods to solve common tasks:
Learn more in the documentation for
The package provides convenient tools to work with Cube in Vue:
Here are the typical steps to query and visualize analytical data in Vue:
@cubejs-client/vuepackages. These packages provide all the necessary methods and convenient Vue tools.
- Query data from Cube Backend. Use QueryBuilder or QueryRenderer and their props to execute a query and transform the result set. See Query Format for details.
- Transform data for visualization. Use
props to transform the result set. Furthermore, the result set has convenient
methods, such as
chartPivot, to prepare data for charting.
- Visualize the data. Use tools of your choice to draw charts and create visualizations.
See an example of using Cube with Vue and Chart.js library. Note that you can always use a different charting library that suits your needs:
npm install --save @cubejs-client/core @cubejs-client/vue3
yarn add @cubejs-client/core @cubejs-client/vue3
Note. If you're using Vue 2, please use