Hereby a solution that works for me. Instead of using a repeater, this codesample works with the ChartView's onCompleted signal handler. In the onCompleted handler first three LineSeries are dynamically created, then an AreaSeries is created.
ChartView {
id: chartid
anchors.fill: parent
antialiasing: true
//Valueaxis
ValueAxis{ id:xAxis; min: 0; max: 40000; tickCount: 9 }
ValueAxis{ id:yAxis; min: -200; max: 1400; tickCount: 17 }
//Listmodel only for testing Area- and LineSeries concept
ListModel{
id: listModel
ListElement { x1: 18000; y1: -100; x2: 18000 ; y2: 400 }
ListElement { x1: 25000; y1: -100; x2: 25000 ; y2: 1000 }
ListElement { x1: 31000; y1: -100; x2: 31000 ; y2: 1200 }
ListElement { x1: 36500; y1: -100; x2: 39700 ; y2: 1250 }
}
Component.onCompleted: {
var count = listModel.count;
for(var i = 0;i < count;i ++)
{
if (i < count - 1) // add LineSeries
{
var lineTypeSeries = chartid.createSeries(ChartView.SeriesTypeLine, "line" + i, xAxis, yAxis);
lineTypeSeries.color = "black";
lineTypeSeries.width = 2;
lineTypeSeries.borderWidth = 0;
lineTypeSeries.append(listModel.get(i).x1, listModel.get(i).y1);
lineTypeSeries.append(listModel.get(i).x2, listModel.get(i).y2);
}
else
{
var areaTypeSeries = chartid.createSeries(ChartView.SeriesTypeArea, "area" + i, xAxis, yAxis);
areaTypeSeries.pointsVisible = true;
areaTypeSeries.color = "lightgrey";
areaTypeSeries.borderColor = "black";
areaTypeSeries.borderWidth = 2;
areaTypeSeries.lowerSeries = chartid.createSeries(ChartView.SeriesTypeLine, "lowerSerie");
areaTypeSeries.lowerSeries.width = 0;
areaTypeSeries.lowerSeries.borderWidth = 0;
areaTypeSeries.lowerSeries.color = areaTypeSeries.borderColor;
areaTypeSeries.lowerSeries.capStyle = 0x00;
areaTypeSeries.lowerSeries.append(listModel.get(i).x1, listModel.get(i).y1);
areaTypeSeries.lowerSeries.append(listModel.get(i).x2, listModel.get(i).y1);
areaTypeSeries.upperSeries.append(listModel.get(i).x1, listModel.get(i).y2);
areaTypeSeries.upperSeries.append(listModel.get(i).x2, listModel.get(i).y2);
}
}
}
}
