No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Quasar ECharts Sample Application

    Useful Tips (NEW)
    2
    4
    1597
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Pratik Patel
      Pratik Patel last edited by Pratik Patel

      Hello Guys,

      I made Sample Project with Quasar V1 and ECharts.

      we use the npm packages:

      • echarts
      • vue-echarts-v3

      Github: https://github.com/pratik227/quasar-echarts

      Demo :

      QuasarEcharts.png

      1 Reply Last reply Reply Quote 3
      • Pratik Patel
        Pratik Patel last edited by Pratik Patel

        Hello Guys, I have updated the Quasar Echarts demo app with Echarts v5.You can access it using the following URL.

        Github - https://github.com/pratik227/quasar-echarts

        Demo - https://quasar-echarts-v5.netlify.app/

        QuasarEchartV5.png

        W 1 Reply Last reply Reply Quote 2
        • W
          wongkm7749 @Pratik Patel last edited by wongkm7749

          @pratik-patel Nice work, bro. May I know how did you deal with RWD of those charts, since I viewed those charts’ width were changed along with the window’s width?

          1 Reply Last reply Reply Quote 0
          • Pratik Patel
            Pratik Patel last edited by

            I have used the QResizeObserver and on resize method I use the chart reference and then called the resize method

            this.line_chart.resize();

            1 Reply Last reply Reply Quote 0
            • First post
              Last post