Qt 单击线系列时获取QML ChartView线系列的名称
我创建了一个程序，从互联网上读取股票数据（时间序列），并将其显示在QML图表视图中。在我添加了我想要的所有行序列之后，我可以通过单击按钮来删除它们 我想知道是否可以通过单击线条系列中的任意点来删除线条系列 我正在动态添加该系列，如下所示：Qt 单击线系列时获取QML ChartView线系列的名称,qt,qml,lineseries,Qt,Qml,Lineseries,我创建了一个程序，从互联网上读取股票数据（时间序列），并将其显示在QML图表视图中。在我添加了我想要的所有行序列之后，我可以通过单击按钮来删除它们 我想知道是否可以通过单击线条系列中的任意点来删除线条系列 我正在动态添加该系列，如下所示： // stockID is sent from C++ when the timeSeriesReady signal is emitted var chartViewSeries = chartView.createSeries(ChartView.Seri
// stockID is sent from C++ when the timeSeriesReady signal is emitted
var chartViewSeries = chartView.createSeries(ChartView.SeriesTypeLine, stockID, dateTimeAxis_chartView_xAxis, valueAxis_chartView_yAxis);
// Set chartViewSeries (AbstractSeries/LineSeries) properties
chartViewSeries.onClicked.connect(lineSeriesClicked);
chartViewSeries.onHovered.connect(lineSeriesHovered);
stockChart.setLineSeries(chartViewSeries);
import QtQuick 2.2
import QtQuick.Controls 2.3
import QtQuick.Window 2.10
import QtQuick.Layouts 1.3
import QtDataVisualization 1.2
import QtCharts 2.2
import Qt3D.Input 2.0
// I imported more than I used because it's a part of a big project...
Item{
id: mainWindow
ListModel{
id: jsonData
Component.onCompleted: // line
{
//create a request and tell it where the json that I want is
var req = new XMLHttpRequest();
var location = "URL-to-JSON-DATA"
//tell the request to go ahead and get the json
req.open("GET", location, true);
req.send(null);
//wait until the readyState is 4, which means the json is ready
req.onreadystatechange = function()
{
console.log("Req status:"+req.status+"("+req.readyState+")");
if (req.readyState == 4)
{
//turn the text in a javascript object while setting the ListView's model to it
if (req.responseText){
var result = JSON.parse(req.responseText);
for (var i =0; i < result.rows.length;i++){
// map the Json to a model
jsonData.append({"sensor":result['rows'][i]['value'][0],"activePower": result['rows'][i]['value'][1],"voltage":result['rows'][i]['value'][2], "current":result['rows'][i]['value'][3], "year":result['rows'][i]['key'][0],"month": result['rows'][i]['key'][1],"day":result['rows'][i]['key'][2], "hour":result['rows'][i]['key'][3], "minute":result['rows'][i]['key'][4] })
};
//Sucess string
console.log("JSON [Sensor,Date,Hour] loaded");
//Fail string :(
} else {console.log("Empty[Sensor,Date,Hour JSON");}
}
}
}
}
ChartView {
title: "Line"
id: mainChart
anchors.fill: parent
antialiasing: true
Repeater{
model: jsonData
Item {
Component.onCompleted: {
if( mainChart.series(sensor)) {
mainChart.series(sensor).append(10,activePower);
} else{
mainChart.createSeries(ChartView.SeriesTypeLine,sensor,lineXOrdinate,lineYOrdinate );
mainChart.series(sensor).append(hour+(minute*0.5)/30,activePower);
mainChart.series(sensor).hovered.connect(
function (point,state){
if (state){
console.log(">>>"+sensor); // print the Series label =D
}
});
}
if(activePower > lineYOrdinate.max){ // if the highest value is above the Y axis, reset it to value+10
lineYOrdinate.max = activePower +10;
}
}
}
}
}
ValueAxis {
id: lineYOrdinate
min:0
max:11
}
ValueAxis {
id: lineXOrdinate
min:0
max:24
}
}
- dateTimeAxis_chartView_xAxis是主图表视图QML类型中的dateTimeAxis QML类型，id为：chartView
- valueAxis\u chartView\u yAxis是id为chartView的主chartView QML类型中的valueAxis QML类型
- stockChart是从C导入的stockChart QML类型的id++
- lineSeriesClicked用于此功能：
function lineSeriesClicked(lineSeriesPoint){ console.log(lineSeriesPoint); }function lineSeriesHovered(lineSeriesPoint, isHovered){ if(isHovered){ var date = new Date(lineSeriesPoint.x); console.log(date.getFullYear() + "-" + (((date.getMonth()+1) < 10) ? ("0" + (date.getMonth()+1).toString()) : (date.getMonth()+1)) + "-" + (((date.getDate()) < 10) ? ("0" + (date.getDate()).toString()) : (date.getDate())) + " -> " + lineSeriesPoint.y); } } - lineSeriesHovered用于此功能：
function lineSeriesClicked(lineSeriesPoint){ console.log(lineSeriesPoint); }
单击时：function lineSeriesHovered(lineSeriesPoint, isHovered){ if(isHovered){ var date = new Date(lineSeriesPoint.x); console.log(date.getFullYear() + "-" + (((date.getMonth()+1) < 10) ? ("0" + (date.getMonth()+1).toString()) : (date.getMonth()+1)) + "-" + (((date.getDate()) < 10) ? ("0" + (date.getDate()).toString()) : (date.getDate())) + " -> " + lineSeriesPoint.y); } }
查看XYSeries QML Type（），我使用的单击信号只传递a点 是否有任何方法可以获取获取点数据的直线序列的名称，以便能够删除该序列？也许通过某种上下文访问或“this”关键字qml: QPointF(1.50432e+12, 65.0453)
非常感谢 我不知道你是否解决了这个问题，但只是为了文档。。。我可以用模型视图代理解决它。在我的示例中，我使用传感器数据生成图形，我希望可以通过系列标签连接不同的图形（例如饼图和线）。我可以使用这个模型视图委托透视图来完成。我是这样想的：// stockID is sent from C++ when the timeSeriesReady signal is emitted var chartViewSeries = chartView.createSeries(ChartView.SeriesTypeLine, stockID, dateTimeAxis_chartView_xAxis, valueAxis_chartView_yAxis); // Set chartViewSeries (AbstractSeries/LineSeries) properties chartViewSeries.onClicked.connect(lineSeriesClicked); chartViewSeries.onHovered.connect(lineSeriesHovered); stockChart.setLineSeries(chartViewSeries);import QtQuick 2.2 import QtQuick.Controls 2.3 import QtQuick.Window 2.10 import QtQuick.Layouts 1.3 import QtDataVisualization 1.2 import QtCharts 2.2 import Qt3D.Input 2.0 // I imported more than I used because it's a part of a big project... Item{ id: mainWindow ListModel{ id: jsonData Component.onCompleted: // line { //create a request and tell it where the json that I want is var req = new XMLHttpRequest(); var location = "URL-to-JSON-DATA" //tell the request to go ahead and get the json req.open("GET", location, true); req.send(null); //wait until the readyState is 4, which means the json is ready req.onreadystatechange = function() { console.log("Req status:"+req.status+"("+req.readyState+")"); if (req.readyState == 4) { //turn the text in a javascript object while setting the ListView's model to it if (req.responseText){ var result = JSON.parse(req.responseText); for (var i =0; i < result.rows.length;i++){ // map the Json to a model jsonData.append({"sensor":result['rows'][i]['value'][0],"activePower": result['rows'][i]['value'][1],"voltage":result['rows'][i]['value'][2], "current":result['rows'][i]['value'][3], "year":result['rows'][i]['key'][0],"month": result['rows'][i]['key'][1],"day":result['rows'][i]['key'][2], "hour":result['rows'][i]['key'][3], "minute":result['rows'][i]['key'][4] }) }; //Sucess string console.log("JSON [Sensor,Date,Hour] loaded"); //Fail string :( } else {console.log("Empty[Sensor,Date,Hour JSON");} } } } } ChartView { title: "Line" id: mainChart anchors.fill: parent antialiasing: true Repeater{ model: jsonData Item { Component.onCompleted: { if( mainChart.series(sensor)) { mainChart.series(sensor).append(10,activePower); } else{ mainChart.createSeries(ChartView.SeriesTypeLine,sensor,lineXOrdinate,lineYOrdinate ); mainChart.series(sensor).append(hour+(minute*0.5)/30,activePower); mainChart.series(sensor).hovered.connect( function (point,state){ if (state){ console.log(">>>"+sensor); // print the Series label =D } }); } if(activePower > lineYOrdinate.max){ // if the highest value is above the Y axis, reset it to value+10 lineYOrdinate.max = activePower +10; } } } } } ValueAxis { id: lineYOrdinate min:0 max:11 } ValueAxis { id: lineXOrdinate min:0 max:24 } }
X轴有24个值长，因为我正在映射一天。 我希望这对你有帮助导入QtQuick 2.2 导入QtQuick.Controls 2.3 导入QtQuick.Window 2.10 导入QtQuick.Layouts 1.3 导入QtDataVisualization 1.2 导入QT2.2 导入Qt3D。输入2.0 //我进口的比用的多，因为这是一个大项目的一部分。。。 项目{ id:主窗口 列表模型{ id:jsonData Component.onCompleted://行 { //创建一个请求并告诉它我想要的json在哪里 var req=新的XMLHttpRequest（）； var location=“指向JSON数据的URL” //告诉请求继续并获取json 请求打开（“获取”，位置，真）； 请求发送（空）； //等待readyState为4，这意味着json已准备就绪 req.onreadystatechange=函数（） { 控制台日志（“请求状态：+Req.status+”（“+Req.readyState+”））； 如果（req.readyState==4） { //在将ListView的模型设置为javascript对象时，将文本转换为javascript对象 如果（请求响应文本）{ var result=JSON.parse（req.responseText）； for（var i=0；i