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. Draw chart with "tolerance area" and different colored trend-line inside or outside of this area
Forum Updated to NodeBB v4.3 + New Features

Draw chart with "tolerance area" and different colored trend-line inside or outside of this area

Scheduled Pinned Locked Moved QML and Qt Quick
1 Posts 1 Posters 469 Views 2 Watching
  • 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.
  • C Offline
    C Offline
    CompuChino
    wrote on last edited by CompuChino
    #1

    Hello,

    I'm quite new to Qt and QML. I need to draw a chart with a horizontal area drawn in a different color. The trend line I draw should have different colors inside and outside of this "tolerance" area.

    Now my questions:

    • So far I have drawn the horizontal area (tolerance area) with an AreaSeries (look at the source code below). Is there a better way to do this?
    • I couldn't find a possibility to give my trend line (LineSeries) different colors inside and outside of this horizontal area. How can I do this? It just occured to me, that I could do it with different LineSeries, but this would need a lot of calculating. Is there a better solution?
    • On the y axis I want to print the value next to the reference line bold or in a bigger font. Can I do this just for one label of the axis?

    Here is my actual source code:
    import QtQuick 2.3
    import QtQuick.Window 2.2
    import QtCharts 2.0

    Window {
    visible: true
    width: 720
    height: 720

    // Pick Count
    ChartView {
        backgroundColor: "lightgrey"
        height: parent.height; width: parent.width
        dropShadowEnabled: true
        legend.visible: false
        title: qsTr("Pick count")
    
        ValueAxis {
            id: axisX
            color: "black"
            min: -100.0
            max: 0.0
            tickCount: 11
            titleText: "m"
        }
    
        ValueAxis {
            id: axisY
            color: "black"
            min: 14.0
            max: 22.0
            tickCount: 5
            titleText: "F/cm"
        }
    
        // Trend line
        LineSeries {
            axisX: axisX
            axisY: axisY
    
            XYPoint { x: 0.0; y: 17.0}
            XYPoint { x: -10.0; y: 17.5}
            XYPoint { x: -20.0; y: 15.9}
            XYPoint { x: -30.0; y: 16.0}
            XYPoint { x: -40.0; y: 16.3}
            XYPoint { x: -50.0; y: 16.4}
            XYPoint { x: -60.0; y: 17.2}
            XYPoint { x: -70.0; y: 17.0}
            XYPoint { x: -80.0; y: 18.3}
            XYPoint { x: -90.0; y: 18.0}
            XYPoint { x: -100.0; y: 19.0}
        }
    
        // Tolerance area
        AreaSeries {
            axisX: axisX
            axisY: axisY
            borderColor: "transparent"
            borderWidth: 0.0
            opacity: 0.4
            lowerSeries: LineSeries {
                XYPoint { x: 0.0; y: 17.0}
                XYPoint { x: -99.9; y: 17.0}
            }
            upperSeries: LineSeries {
                XYPoint { x: 0.0; y: 19.0}
                XYPoint { x: -99.9; y: 19.0}
            }
        }
    
        // Reference line
        LineSeries {
            axisX: axisX
            axisY: axisY
    
            XYPoint { x: 0.0; y: 18.0}
            XYPoint { x: -100.0; y: 18.0}
        }
    }
    

    }

    Any help is highly appreciated!

    Christine

    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