3

我想在 ScatterSeries 的 ChartView 上放置一些矩形作为叠加层来显示感兴趣的区域。但是，当我尝试这样做时，它显然使用了与 ScatterSeries 不同的坐标系，因为它是在完全不同的位置绘制的。

例如，以下内容旨在绘制一个捕获所有 ScatterSeries 的矩形，但它仅在左上角绘制一个小的绿色矩形，如屏幕截图所示。

        ChartView {
            id: view
            Layout.fillWidth : true
            Layout.fillHeight : true
            Rectangle {
                id: rec
                x: 30
                y: 50
                width: 40
                height: 10
                color: "green"
            }
            ScatterSeries{
                id: series
                XYPoint { x: 30; y: 50 }
                XYPoint { x: 50; y: 60 }
                XYPoint { x: 60; y: 50 }
                XYPoint { x: 70; y: 60 }
                axisX: ValueAxis {
                    min: 0
                    max: 100
                }
                axisY: ValueAxis {
                    min: 0
                    max: 100
                }
            }

在此处输入图像描述

文档建议矩形应该使用父 ChartView 的坐标系。我假设我实际上希望它使用 ChartView 场景的坐标系。我该怎么做呢？

4

1 回答 1

3

要从ScatterSeries坐标系转换为像素坐标以放置子级ChartView使用mapToPosition(...)：

function updateRectangle() {
    var topLeftPoint = view.mapToPosition(Qt.point(30,60), series)
    var bottomRightPoint = view.mapToPosition(Qt.point(70,50), series)

    rec.x = topLeftPoint.x
    rec.y = topLeftPoint.y

    rec.width  = bottomRightPoint.x - topLeftPoint.x
    rec.height = bottomRightPoint.y - topLeftPoint.y
}

你在哪里，series是你的。ScatterSeriesrecRectangle

每当重新计算图表点时调用更新函数（例如在创建和大小更改之后）。

另请参阅相关问题如何将 QChart 坐标映射到 QChartView 点？

于 2019-08-09T06:12:58.170 回答