Uso de marcadores luminosos y selección de puntos

Nota: Esto es parte del ejemplo de la Galería de Gráficos con Widgets.

Captura de pantalla que muestra un ejemplo de gráfico lineal con la opción de cambiar el color de la línea y el color de los puntos seleccionados y mostrar los puntos no seleccionados.

Captura de pantalla que muestra otro ejemplo de gráfico lineal con la opción de cambiar el color de la línea y el color de los puntos seleccionados y mostrar los puntos no seleccionados.

Comenzamos creando una serie, llenándola con los datos y configurando la funcionalidad de selección. Es importante no configurar la visibilidad de los puntos en true, porque la funcionalidad de los marcadores de luz es una característica independiente y configurar ambas resultaría en un comportamiento no deseado.

constexpr qreal marker_size = 20.;

auto series = new QSplineSeries;
series->append({QPointF(0., 0.),
                QPointF(0.5, 2.27),
                QPointF(1.5, 2.2),
                QPointF(3.3, 1.7),
                QPointF(4.23, 3.1),
                QPointF(5.3, 2.3),
                QPointF(6.47, 4.1)
});
series->setMarkerSize(marker_size);
series->setLightMarker(rectangle(marker_size, Qt::red));
series->setSelectedLightMarker(blueTriangle(marker_size));

QObject::connect(series, &QXYSeries::clicked, series, [=](const QPointF &point) {
    int index = series->points().indexOf(point);
    if (index != -1)
        series->toggleSelection({index});
});

A continuación creamos el QChart, el QChartview y el widget de control con su diseño para organizar los elementos de personalización.

auto chart = new QChart;
chart->addSeries(series);
chart->createDefaultAxes();
chart->legend()->setVisible(false);
chart->layout()->setContentsMargins(0, 0, 0, 0);
chart->setTitle("Select points with mouse click");

auto chartView = new QChartView(chart, this);
chartView->setRenderHint(QPainter::Antialiasing);

auto controlWidget = new QWidget(this);
auto controlLayout = new QGridLayout(controlWidget);

El siguiente paso es crear los elementos de personalización.

auto charPointCombobox = new QComboBox(controlWidget);
auto charPointSelectedCombobox = new QComboBox(controlWidget);
auto lineColorCombobox = new QComboBox(controlWidget);
auto showUnselectedPointsCheckbox = new QCheckBox(controlWidget);

Creamos la etiqueta para el combobox de selección de marcador y añadimos rellenar el combobox con los elementos. Además, proporcionamos funcionalidad al combobox. Teniendo en cuenta la implementación de la funcionalidad de los marcadores de luz, tenemos que asegurarnos de que la visualización de los puntos no seleccionados está marcada. La desactivación de la visibilidad del marcador luminoso se consigue configurándolo en "empty" QImage . Si el usuario desactiva la visualización de los puntos no seleccionados y cambia la imagen del marcador luminoso, los puntos no seleccionados deben permanecer invisibles. Si no se realiza la comprobación, se establecerá un nuevo QImage para el marcador de luz y los puntos no seleccionados serán visibles aunque se haya desactivado.

auto charPoint = new QLabel(tr("Char point: "), controlWidget);
charPointCombobox->addItems({tr("Red rectangle"),
                             tr("Green triangle"),
                             tr("Orange circle")
});
QObject::connect(charPointCombobox, &QComboBox::currentIndexChanged, series, [=](const int index) {
    if (showUnselectedPointsCheckbox->isChecked())
        series->setLightMarker(getPointRepresentation(PointType(index), marker_size));
});

Casi el mismo procedimiento se aplica al marcador de luz de puntos seleccionados y al color de la línea. La única diferencia es que no hay necesidad de comprobar la visibilidad de los puntos no seleccionados, ya que no afecta a la funcionalidad.

auto charPointSelected = new QLabel(tr("Char point selected: "), controlWidget);
charPointSelectedCombobox->addItems({tr("Blue triangle"),
                                     tr("Yellow rectangle"),
                                     tr("Lavender circle")
});
QObject::connect(charPointSelectedCombobox, &QComboBox::currentIndexChanged, series, [=](const int index) {
    series->setSelectedLightMarker(getSelectedPointRepresentation(SelectedPointType(index), marker_size));
});

auto lineColorLabel = new QLabel(tr("Line color: "), controlWidget);
lineColorCombobox->addItems({tr("Blue"),
                             tr("Black"),
                             tr("Mint")
});
QObject::connect(lineColorCombobox, &QComboBox::currentIndexChanged, series, [=](const int index) {
    series->setColor(makeLineColor(LineColor(index)));
});

Una pequeña diferencia viene con el cambio de visibilidad de los puntos no seleccionados. Como se mencionó antes, hacer invisibles los marcadores luminosos se consigue configurándolos como "vacíos" QImage. Por eso, dependiendo del estado de la casilla de verificación, el marcador de luz del punto seleccionado se establece en "vacío" QImage o en el marcador de luz extraído del índice actual del combobox correspondiente.

auto showUnselectedPointsLabel = new QLabel(tr("Display unselected points: "), controlWidget);
showUnselectedPointsCheckbox->setChecked(true);
QObject::connect(showUnselectedPointsCheckbox, &QCheckBox::stateChanged, series, [=](const int state) {
    if (state)
        series->setLightMarker(getPointRepresentation(PointType(charPointCombobox->currentIndex()), marker_size));
    else
        series->setLightMarker(QImage());
});

La parte final consiste en organizar los elementos, añadir todos los widgets al widget principal y establecer el tamaño de la ventana principal.

controlLayout->addWidget(charPoint, 0, 0);
controlLayout->addWidget(charPointCombobox, 0, 1);

controlLayout->addWidget(charPointSelected, 1, 0);
controlLayout->addWidget(charPointSelectedCombobox, 1, 1);

controlLayout->addWidget(lineColorLabel, 2, 0);
controlLayout->addWidget(lineColorCombobox, 2, 1);

controlLayout->addWidget(showUnselectedPointsLabel, 3, 0);
controlLayout->addWidget(showUnselectedPointsCheckbox, 3, 1, 1, 2);

m_mainWidget = new QWidget(this);
auto mainLayout = new QHBoxLayout(m_mainWidget);
mainLayout->addWidget(chartView);
mainLayout->addWidget(controlWidget);

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.