在QChartView上实现选择功能

6
我希望基于 QChartQChartView 制作图表选择的实现。 这些类族有一个巨大的优势 - 易于使用的openGL动画效果, 例如:
QLineSeries *series = new QLineSeries();
series->setUseOpenGL(true); // <==

QChart *chart = new QChart();
chart->addSeries(series);
chart->setAnimationOptions(QChart::AllAnimations); // <==

QChartView *chartView = new QChartView(chart);
chartView->setRenderHint(QPainter::Antialiasing);    

QChartView 类提供了有用的缩放功能 - QChartView::setRubberBand()

chartView->setRubberBand(QChartView::RectangleRubberBand);

enter image description here

主要问题是橡皮筋只能用于缩放,但我需要实现水平选择而不是缩放,就像音频编辑器中通常实现的功能一样: enter image description here 现在,当我继承QChartView时,我可以在选择后禁用缩放:
class ChartView : public QChartView
...
bool m_drawRubberBand;
QRubberBand m_rubberBand;
...

ChartView::ChartView(QChart *chart, QWidget *parent) 
    : QChartView(chart, parent)
{
    setRubberBand(QChartView::HorizontalRubberBand);
}
...

// Just copy-paste from the Qt 5 sources - file \Src\qtcharts\src\charts\qchartview.cpp:
/*!
If the rubber band rectangle is displayed in the press event specified by
\a event, the event data is used to update the rubber band geometry.
Otherwise, the default QGraphicsView::mouseMoveEvent() implementation is called.
*/
void ChartView::mouseMoveEvent(QMouseEvent *event)
{
    if (m_drawRubberBand && m_rubberBand.isVisible()) 
    {
        QRect rect = chart()->plotArea().toRect();
        int width = event->pos().x() - m_rubberBandOrigin.x();
        int height = event->pos().y() - m_rubberBandOrigin.y();
        if (!rubberBand().testFlag(VerticalRubberBand)) 
        {
            m_rubberBandOrigin.setY(rect.top());
            height = rect.height();
        }
        if (!rubberBand().testFlag(HorizontalRubberBand))
        {
            m_rubberBandOrigin.setX(rect.left());
            width = rect.width();
        }
        m_rubberBand.setGeometry(QRect(m_rubberBandOrigin.x(), m_rubberBandOrigin.y(), width, height).normalized());
    }
    else 
    {
        QGraphicsView::mouseMoveEvent(event);
    }
}

那我就可以在鼠标释放事件上不实现缩放操作:
void ChartView::mouseReleaseEvent(QMouseEvent *event)
{
    if (m_rubberBand.isVisible()) 
    {
        if (event->button() == Qt::LeftButton)
        {
            m_drawRubberBand = false;    
            do_nothing(); // <==
        }

    }
}

所以,我的问题现在是:

  1. How borders of the the visual rubber band can be mapped to real chart's coordinates. I.e., how can the selection be mapped into a line series on the chart? Now I receive same wrong coordinates:

      void MyView::resizeEvent(QResizeEvent *event) 
      {
          QChartView::resizeEvent(event);
    
          QRect rct(QPoint(10, 10), QPoint(20, 20));
          qDebug() << mapToScene(rct); <==
      }
    

输出:

QPolygonF(QPointF(10,10)QPointF(21,10)QPointF(21,21)QPointF(10,21))
QPolygonF(QPointF(10,10)QPointF(21,10)QPointF(21,21)QPointF(10,21))
QPolygonF(QPointF(10,10)QPointF(21,10)QPointF(21,21)QPointF(10,21))
QPolygonF(QPointF(10,10)QPointF(21,10)QPointF(21,21)QPointF(10,21))
...
  1. 如何将现有的橡皮筋选择与视图一起按比例调整大小?

编辑:也许这是一个有用的关键词 - QGraphicsScene::setSelectionArea()

Qt 5芯片示例提供了漂亮的橡皮筋选择, 但该示例基于QGraphicsView,而不是基于QChartView。

1个回答

5
问题已经得到解决,感谢回答这个问题的答案:在QChartView的坐标系中获取鼠标坐标
关键时刻:需要调用QChart::mapToValue()来正确地进行坐标转换:
QPointF ChartView::point_to_chart(const QPoint &pnt)
{
    QPointF scene_point = mapToScene(pnt);
    QPointF chart_point = chart()->mapToValue(scene_point);

    return chart_point;
}

以及反转换:

QPoint ChartView::chart_to_view_point(QPointF char_coord)
{
    QPointF scene_point = chart()->mapToPosition(char_coord);
    QPoint view_point = mapFromScene(scene_point);

    return view_point;
}

这是我如何在 resizeEvent 中实现橡皮筋的调整大小。
首先,在鼠标释放事件中保存当前的橡皮筋:

void ChartView::mouseReleaseEvent(QMouseEvent *event)
{
    if (m_rubberBand.isVisible()) 
    {
        update_rubber_band(event);            
        m_drawRubberBand = false;
        save_current_rubber_band(); <==            
    }
}

在哪里:

void ChartView::update_rubber_band(QMouseEvent * event)
{
    QRect rect = chart()->plotArea().toRect();
    int width = event->pos().x() - m_rubberBandOrigin.x();
    int height = event->pos().y() - m_rubberBandOrigin.y();
    if (!rubberBand().testFlag(VerticalRubberBand))
    {
        m_rubberBandOrigin.setY(rect.top());
        height = rect.height();
    }
    if (!rubberBand().testFlag(HorizontalRubberBand))
    {
        m_rubberBandOrigin.setX(rect.left());
        width = rect.width();
    }
    m_rubberBand.setGeometry(QRect(m_rubberBandOrigin.x(), m_rubberBandOrigin.y(), width, height).normalized());
}

并且:

void ChartView::save_current_rubber_band()
{
    QRect rect = m_rubberBand.geometry();

    QPointF chart_top_left = point_to_chart(rect.topLeft());
    m_chartRectF.setTopLeft(chart_top_left);

    QPointF chart_bottom_right = point_to_chart(rect.bottomRight());
    m_chartRectF.setBottomRight(chart_bottom_right);
}

如何在调整大小事件中重新绘制橡胶:

void ChartView::resizeEvent(QResizeEvent *event)
{
    QChartView::resizeEvent(event);

    if (m_rubberBand.isVisible())
    {
        restore_rubber_band();
    }

    apply_nice_numbers();
}

在哪里:

void ChartView::restore_rubber_band()
{
    QPoint view_top_left = chart_to_view_point(m_chartRectF.topLeft());
    QPoint view_bottom_right = chart_to_view_point(m_chartRectF.bottomRight());

    m_rubberBandOrigin = view_top_left;
    m_rubberBand.setGeometry(QRect(view_top_left, view_bottom_right));
}

同时,不要忘记“好的数字”("nice numbers")

void ChartView::apply_nice_numbers()
{
    QList<QAbstractAxis*> axes_list = chart()->axes();
    for each(QAbstractAxis* abstract_axis in axes_list)
    {
        QValueAxis* value_axis = qobject_cast<QValueAxis*>(abstract_axis);
        if (value_axis)
        {
            value_axis->applyNiceNumbers();
        }
    }
}

这是实际应用的逻辑。 调整大小之前: enter image description here 调整大小后: enter image description here

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接