Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

[QML & c++ model] Multiple charts in same chartview problem with axis



  • Hi all!
    I have the following code (QML) for my chartview:

    import QtQuick 2.9
    import QtCharts 2.2
    
    
    Item {
        id: root;
    
        ValueAxis {
            id: yAxis;
            min: 0;
            max: 125;
            tickCount: 6;
        }
    
        ValueAxis {
            id: xAxis;
            min: -100;
            max: 100;
            tickCount: 9;
        }
    
        VXYModelMapper {
            series: lineSeries;
            model: TESTMODEL;
            xColumn: 0;
            yColumn: 1;
        }
    
        VXYModelMapper {
            series: scatterSeries;
            model: SCATTERMODEL;
            xColumn: 0;
            yColumn: 1;
        }
    
    
        ChartView {
            id: chartView
            anchors.fill: parent
            antialiasing: true;
            legend.visible: false;
    
            Component.onCompleted: {
                setAxisX(xAxis, lineSeries);
                setAxisX(xAxis, scatterSeries);
    
                setAxisY(yAxis, lineSeries);
                setAxisY(yAxis, scatterSeries);
            }
    
            LineSeries {
                id: lineSeries;
                name: "LineSeries";
            }
    
            ScatterSeries {
                id: scatterSeries;
                name: "ScatterSeries";
            }
        }
    }
    

    and the result is as follows.

    0_1528707648370_lineandscatter.png

    What i'm trying to achieve is the two series (line and scatter) to use the same axis. This is possible via c++ (as stated by the example ) where a bar and line series use the same axis.

    Have I done something wrong on my QML part or is this a problem with QML ?



  • Try adding the second series using createSeries on the ChartView as shown here: https://doc.qt.io/Qt-5/qml-qtcharts-chartview.html#createSeries-method



  • @justanotheruser said in [QML & c++ model] Multiple charts in same chartview problem with axis:

    Try adding the second series using createSeries on the ChartView as shown here: https://doc.qt.io/Qt-5/qml-qtcharts-chartview.html#createSeries-method

    That did the trick, adding the second series dynamically. By doing so i had to find a way for getting the scatter model data into the series. As I just need to track one point, this is what I've come up with so far:

        Connections {
            target: TESTMODEL;
            onXValChanged: {
                var scatter = chartView.series(1);
    
                scatter.remove(0);
                scatter.append(TESTMODEL.xVal, TESTMODEL.yVal);
            }
    
            onYValChanged: {
                var scatter = chartView.series(1);
                scatter.remove(0);
                scatter.append(TESTMODEL.xVal, TESTMODEL.yVal);
            }
        }
    

    It's ugly but it does the trick. Any idea why QML was duplicating the axis when using a second lineseries? This solution for now is ok as I only need to track 2 values (x, y) for the scatter series but it'll be a pain for those who want to track a series of more coordinates.


Log in to reply