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. Requesting support for Chartview Drag & drop with cross hair
Forum Updated to NodeBB v4.3 + New Features

Requesting support for Chartview Drag & drop with cross hair

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
1 Posts 1 Posters 131 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.
  • R Offline
    R Offline
    ramakrishna.p
    wrote on last edited by
    #1

    HI I have requirement Chart view drag drop should work with cross hair. i have made sample code and it is working for drag drop but i am facing some issue with the cross hair is not plotting plot area. please support below is my code
    If any solution kindly modify in below code which will help more.
    ///////////////////////////////////////////////////////////////////////////////
    import QtQuick 2.15
    import QtQuick.Window 2.15
    import QtCharts 2.3
    import QtQuick.Controls 2.15
    import QtQuick.Controls.Styles 1.4
    import QtQuick.Layouts 1.3
    import QtGraphicalEffects 1.0
    Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")
    property int xAxis: 0
    /*!
    Holds y co-ordinate on mouse hover
    */
    property int yAxis: 0
    ColumnLayout {
    RowLayout {
    Button {
    text: "zoomIn"
    height: 30
    onClicked: {
    chartview.zoomIn()
    }
    }
    Button {
    text: "zoomOut"
    height: 30
    onClicked: {
    chartview.zoomOut()
    }
    }
    }
    }

    ChartView {
        id: chartview
        anchors.topMargin: 50
        property var selectedPoint: undefined
        anchors.fill: parent
        antialiasing: true
        dropShadowEnabled: true
        property real toleranceX: 0.5
        property real toleranceY: 0.5
    
    
        ValueAxis {
            id: axisX
            min: 0
            max: 5
            titleText: "Current(A)"
            labelsFont:Qt.font({pointSize: 12})
        }
    
        ValueAxis {
            id: axisY
            min: -5
            max: 5
            tickInterval: 1
            titleText: "Time(S)"
            labelsFont:Qt.font({pointSize: 12})
        }
    
        LineSeries {
            id: series1
            axisX: axisX
            axisY: axisY
            pointsVisible: true
            width: 3
            color:"#007b3e"
        }
    
    
        MouseArea {
            anchors.fill: parent
            id: mousearea1
            hoverEnabled: true
            x: chartview.plotArea.x
            y: chartview.plotArea.y
            width: chartview.plotArea.width
            height: chartview.plotArea.height
            property bool movable: true
            property real coordX
            property real coordY
            property real labelX
            property real labelY
    
            onPressed:
            {
                var cp = chartview.mapToValue(Qt.point(mouse.x,mouse.y));
                for(var i = 0;i < series1.count;i ++)
                {
                    var p = series1.at(i);
                    if(Math.abs(cp.x - p.x) <= chartview.toleranceX && Math.abs(cp.y - p.y) <= chartview.toleranceY)
                    {
                        console.log("chartview.selectedPoint :" << chartview.selectedPoint)
                        chartview.selectedPoint = p;
                        break;
                    }
                }
            }
            onPositionChanged: {
                var point = Qt.point(mouse.x, mouse.y);
                var cpoint = chartview.mapToValue(point);
                xAxis = cpoint.x
                yAxis = cpoint.y
                if(chartview.selectedPoint != undefined) {
                    var p = Qt.point(mouse.x, mouse.y);
                    var cp = chartview.mapToValue(p);
                    if(cp.x >= axisX.min && cp.x <= axisX.max && cp.y >= axisY.min && cp.y <= axisY.max) {
                        series1.replace(chartview.selectedPoint.x, chartview.selectedPoint.y, cp.x, cp.y);
                        chartview.selectedPoint = cp;
                    }
                }
                if (movable === true) {
                    var p = Qt.point(mouseX + chartview.plotArea.x, mouseY + chartview.plotArea.y);
                    var cp = chartview.mapToValue(p, series1);
                    coordX = cp.x.toFixed(3)
                    coordY = cp.y.toFixed(3)
                    labelX = mouseX
                    labelY = mouseY
                }
            }
            onEntered: {
                mouseLabel.visible = true
                horizontalLine.visible = true
                verticalLine.visible = true
            }
            onExited: {
                mouseLabel.visible = movable ? false : true
                horizontalLine.visible = movable ? false : true
                verticalLine.visible = movable ? false : true
            }
    
            Label {
                id: mouseLabel
                visible: false
                x: mousearea1.labelX + 1
                y: mousearea1.labelY + 1
                text: " x: " + mousearea1.coordX + "\n y: " + mousearea1.coordY
            }
    
            Rectangle {
                id: horizontalLine
                visible: false
                x: 0
                y: mousearea1.labelY - 1
                height: 2
                width: chartview.plotArea.width
                color: "#007B3E"
            }
    
            Rectangle {
                id: verticalLine
                visible: false
                x: mousearea1.labelX - 1
                y: 0
                height: chartview.plotArea.height
                width: 2
                color: "#007B3E"
            }
            onReleased: {
                chartview.selectedPoint = undefined;
            }
        }
    
    }
    // Add data to the series
    Component.onCompleted: {
        for (var i = 0; i <= 5; i++) {
            series1.append(i, Math.random());
        }
    }
    

    }

    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