Giter Club home page Giter Club logo

pivot-vue's Introduction

Example of integrating WebDataRocks with the Vue 2 framework

This repository contains a sample project that shows how to integrate WebDataRocks with the Vue 2 framework.

Prerequisites

Run the project

  1. Download or clone this project from GitHub:
git clone https://github.com/WebDataRocks/pivot-vue.git
cd pivot-vue
  1. Install npm packages:
npm install
  1. Run the project:
npm run serve

You can access the project at http://localhost:8080/.

Related docs

For details on how to integrate WebDataRocks into existing Vue projects, check out the integration with Vue.

Support

Feel free to ask WebDataRocks-related questions on StackOverflow.

pivot-vue's People

Contributors

iansadovy avatar maksymkad avatar marviem avatar veronikaro avatar vo-fomin avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

pivot-vue's Issues

vuejs framework how to connect the highcharts?

in vuejs file,I use the methods

  methods: {
    createChart() {
      this.pivot.highcharts.getData(
        {
          type: 'area',
        },
        function(data) {
          Highcharts.setOptions({
            subtitle: {
              text: 'Sales by Countries',
            },
            tooltip: {
              headerFormat: '<b>{series.name}</b><br>',
              pointFormat: '{point.y} $',
            },
            plotOptions: {
              area: {
                marker: {
                  enabled: false,
                  symbol: 'circle',
                  radius: 2,
                  states: {
                    hover: {
                      enabled: true,
                    },
                  },
                },
              },
            },
          })
          Highcharts.chart('highchartsContainer', data)
        },
        function(data) {
          Highcharts.setOptions({
            subtitle: {
              text: 'Sales by Countries',
            },
            tooltip: {
              headerFormat: '<b>{series.name}</b><br>',
              pointFormat: '{point.y} $',
            },
            plotOptions: {
              area: {
                marker: {
                  enabled: false,
                  symbol: 'circle',
                  radius: 2,
                  states: {
                    hover: {
                      enabled: true,
                    },
                  },
                },
              },
            },
          })
          Highcharts.chart('highchartsContainer', data)
        },
      )
    },
}

it doesn't work, and said getData is undefined,i dont know how to resolve it ,hope the author help me,thank you so much

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.