QtCharts中添加标线MarkLine。效果如下
代码如下
import QtQuick 2.9
import QtQuick.Window 2.2
import QtCharts 2.2
Window {
visible: true
width: 640
height: 480
title: qsTr("曲线增加标线")
//开始--------------------------------------------------------------
ChartView
{
id : chartview
anchors.fill: parent
antialiasing: true
property bool marklinevisable : true //标线是否可见
property int markline_orientation: Qt.Horizontal //设置标线方向
ValueAxis {
id: xAxis;
min: 0; max: 10
}
ValueAxis {
id: yAxis
min: 0;max: 10
}
LineSeries {
id : lineSeries
name: "LineSeries"
XYPoint { x: 0; y: 0 }
XYPoint { x: 1.1; y: 2.1 }
XYPoint { x: 1.9; y: 3.3 }
XYPoint { x: 2.1; y: 2.1 }
XYPoint { x: 2.9; y: 4.9 }
XYPoint { x: 3.4; y: 3.0 }
XYPoint { x: 4.1; y: 3.3 }
axisX : xAxis;
axisY : yAxis
}
///
//1
//采用的方式添加一个Rectangle在chartview里面实现标线的功能
Rectangle{
id : markline;
visible: chartview.marklinevisable
color: "red"
property int plotw: chartview.plotArea.width;
property int ploth: chartview.plotArea.height;
x : chartview.plotArea.x;
y : chartview.plotArea.y; // 默认在最上面
width: chartview.markline_orientation==Qt.Horizontal?plotw:2
height: chartview.markline_orientation==Qt.Horizontal?2:ploth
Behavior on x {
NumberAnimation {duration: 500;}
}
Behavior on y {
NumberAnimation {duration: 500;}
}
}
//1
/
//
//2
//设置标线的位置
function setMarkLine(x,y)
{
if (chartview.markline_orientation == Qt.Horizontal) //水平方向
{
//将y的值进行转换
var p1 = chartview.mapToPosition(Qt.point(0,y),lineSeries);
markline.y = p1.y-markline.height/2;
}
else
{
//将x的值进行转换
var p1 = chartview.mapToPosition(Qt.point(x,0),lineSeries);
markline.x = p1.x-markline.width/2;
}
}
//2
//
//鼠标点击事件,点击时移动markline
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton | Qt.RightButton
onClicked: {
if (!chartview.marklinevisable) return;
//测试
if (mouse.button ==Qt.RightButton)
{
chartview.setMarkLine(Math.random()*5,Math.random()*10);
}
else
{
if (chartview.markline_orientation == Qt.Horizontal) //水平方向
{
markline.y = mouse.y-markline.height/2;
}
else
{
markline.x = mouse.x-markline.width/2;
}
}
//
}
}
}
//结束--------------------------------------------------------------
}