Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Scrollable QML Charts

Scrollable QML Charts

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
qtchartsscrollbar
2 Posts 2 Posters 1.6k Views
  • 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.
  • P Offline
    P Offline
    pra7
    wrote on last edited by
    #1

    I am using QT Charts to plot data on the UI, My plot will be real-time and X and Y axis will increase sequentially for that I need to link scrollBar to the graphs. As ChartView is not having an inbuilt scrollbar like in Flickable, I am wondering how to do that in QML, Following is the code:

    import QtQuick 2.6
    import QtQuick.Window 2.2
    import QtCharts 2.0
    import QtQuick.Controls 2.2
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
    
        ChartView {
            id:chartview
            width: 400
            height: 300
            antialiasing: true
    
            LineSeries {
                name: "LineSeries"
                axisX: valueAxis
                XYPoint { x: 0; y: 0.0 }
                XYPoint { x: 1.1; y: 3.2 }
                XYPoint { x: 1.9; y: 2.4 }
                XYPoint { x: 2.1; y: 2.1 }
                XYPoint { x: 2.9; y: 2.6 }
                XYPoint { x: 3.4; y: 2.3 }
                XYPoint { x: 200.1; y: 3.1 }
            }
    
            ValueAxis {
                id: valueAxis
                min: 0
                max: 20
                tickCount: 12
                labelFormat: "%.0f"
    
            }
        }
        
        ScrollBar{
            id:sBarHor
            visible:true
            width: chartview.width
            height:30
            anchors.top:chartview.bottom
            orientation: Qt.Horizontal
            
            
            contentItem: Rectangle {
                implicitHeight: 50
                color:"green"
            }
            
            background: Rectangle{
                color:"red"
            }
            
            onPositionChanged: {
                //How to move the chart
            }
        }        
    }
    
    1. I also found that there are ScrollDown, ScrollRight etc functions for the ChartView but I am not getting how to integrate those with scrollBar.

    2. Is there any alternative to plot data in QML without using QT Charts?

    Please suggest I am using QT 5.9.1.

    1 Reply Last reply
    0
    • K Offline
      K Offline
      Kenz Dale
      wrote on last edited by
      #2

      Worth linking this topic to the answer documented on StackOverflow: https://stackoverflow.com/questions/46886443/scrollable-qml-charts

      1 Reply Last reply
      0

      • Login

      • Login or register to search.
      • First post
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved