Animate PieSlice/PieSeries from old to new value

[sifourquier]

Hello it is possible to animate a PieSeries for exemple when change from 20% to 80% the animation move from 20% to 80%?

transitions: are available in ChartView then i try this code but that not work can you help me?

import QtQuick 2.15
import QtQuick.Controls 2.5
import QtCharts 2.15
import QtQuick.Layouts 1.15

GridLayout {
    id: omsDetail
    property int omsImageSize: 70
    property variant model
    columnSpacing: 70
    rowSpacing: 4
    columns: 2
    Layout.alignment: Qt.AlignHCenter
    
    Repeater {
        model: parent.model
        RowLayout {
            
            Layout.preferredWidth: omsDetail.omsImageSize
            Layout.preferredHeight: omsDetail.omsImageSize
            Image {
                id: imOms2
                Layout.alignment: Qt.AlignRight
                Layout.preferredWidth: omsDetail.omsImageSize
                Layout.preferredHeight: omsDetail.omsImageSize
                source: "qrc:/oms/picture/oms"+model.omsNumber+".png"
            }
            
            ChartView {
                height: omsDetail.omsImageSize
                width: omsDetail.omsImageSize
                plotArea: Qt.rect(0, 0, width, height)
                id: pieOms2
                plotAreaColor: "#00000000"
                backgroundColor: "#00000000"
                titleColor: "#00000000"
                Layout.alignment: Qt.AlignLeft
                Layout.preferredWidth: omsDetail.omsImageSize
                Layout.preferredHeight: omsDetail.omsImageSize
                legend.visible: false
                
                property double ok: model.okCleaning 
                property double bad: model.badCleaning
                transitions: [
                    Transition {
                        NumberAnimation { property: "ok"; duration: 2000 } //animation here
                    },
                    Transition {
                        NumberAnimation { property: "bad"; duration: 2000 } //and here
                    }
                ]
                
                PieSeries {
                    size: 0.98
                    PieSlice {
                        id:pieOk
                        value: pieOms2.ok //for this value
                        color: "#00FF00"
                        
                    }
                    
                    PieSlice {
                        value: pieOms2.bad //and this value
                        color: "#ff8800"
                    }
                }
            }
        }
    }
}

[sifourquier]

hello
i post solutions if other need

i have fix size of the repeater else anim restart from 0

import QtQuick 2.15
import QtQuick.Controls 2.5
import QtCharts 2.15
import QtQuick.Layouts 1.15

GridLayout {
id: omsDetail
property int omsImageSize: 70
property variant model
columnSpacing: 70
rowSpacing: 4
columns: 2
Layout.alignment: Qt.AlignHCenter

Repeater {
    model: 6
    RowLayout {

        Layout.preferredWidth: omsDetail.omsImageSize
        Layout.preferredHeight: omsDetail.omsImageSize
        Image {
            id: imOms2
            Layout.alignment: Qt.AlignRight
            Layout.preferredWidth: omsDetail.omsImageSize
            Layout.preferredHeight: omsDetail.omsImageSize
            source: "qrc:/oms/picture/oms"+model.omsNumber+".png"
        }

        ChartView {
            height: omsDetail.omsImageSize
            width: omsDetail.omsImageSize
            plotArea: Qt.rect(0, 0, width, height)
            id: pieOms2
            plotAreaColor: "#00000000"
            backgroundColor: "#00000000"
            titleColor: "#00000000"
            Layout.alignment: Qt.AlignLeft
            Layout.preferredWidth: omsDetail.omsImageSize
            Layout.preferredHeight: omsDetail.omsImageSize
            legend.visible: false

            property double nextOk: omsDetail.model[index].okCleaning
            property double nextBad: omsDetail.model[index].badCleaning

            onNextOkChanged:PropertyAnimation { target: pieOms2; property: "ok"; to: pieOms2.nextOk; easing.type:Easing.InOutQuad; easing.amplitude: 2.0; duration: 300 }
            onNextBadChanged:PropertyAnimation { target: pieOms2; property: "bad"; to: pieOms2.nextBad; easing.type:Easing.InOutQuad; easing.amplitude: 2.0; duration: 300 }

            property double ok: 0
            property double bad: 1

            PieSeries {
                size: 0.98
                PieSlice {
                    id:pieOk
                    value: pieOms2.ok
                    color: "#00FF00"

                }

                PieSlice {
                    value: pieOms2.bad
                    color: "#ff8800"
                }
            }
        }
    }
}

}