Requesting support for Chartview Drag & drop with cross hair

[ramakrishna.p]

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());
    }
}

}