Error: Binding loop detected for property "width" .

[Bhushan_Sure]

Initially it is running fine but when i expand window ,this error is getting generated which is given as question
Complete Code is given below

import QtQuick 2.9
import QtQuick.Window 2.3
import QtCharts 2.3
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4


// Completed
Rectangle
{
    id:top
    visible: true
    width: 400
    height: 600
    color: "black"

    property double  x_variable_chrt_1: 0
    property double  y_variable_chrt_1: 0

    // ChartView 1
    ChartView
    {
        id:chrt
        height: top.height/3
        width: top.width+18.5
        x:-9.2
        antialiasing: true
        legend.visible: false
        backgroundRoundness: 0
        margins.top: 1
        margins.bottom: 1
        margins.left: 1
        margins.right: 1
        backgroundColor: "black"

        ValueAxis
        {
            id:x_axis
            min: 0
            max: 50
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis_right
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        LineSeries
        {
            id:l1
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 3.5
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
        }

        LineSeries
        {
            id:l2
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 2
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
        }

        LineSeries
        {
            id:l3
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+1.67 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+1.67 }
            style: Qt.DotLine
        }
    }

    // ChartView 2
    ChartView
    {
        id:chrt2
        height: top.height/3
        width: top.width+18.5
        x:-9.2
        antialiasing: true
        anchors.top: chrt.bottom
        legend.visible: false
        backgroundRoundness: 0
        margins.top: 15
        margins.bottom: 1
        margins.left: 1
        margins.right: 1
        backgroundColor: "black"

        ValueAxis
        {
            id:x_axis_2
            min: 0
            max: 50
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis_2
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis_right_2
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        LineSeries
        {
            id:l1_2
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 3.5
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
        }

        LineSeries
        {
            id:l2_2
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 2
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
        }

        LineSeries
        {
            id:l3_2
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+1.67 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+1.67 }
            style: Qt.DotLine
        }
    }

    // ChartView 3
    ChartView
    {
        id:chrt3
        height: top.height/3
        width: top.width+18.5
        anchors.top: chrt2.bottom
        x:-9.2
        antialiasing: true
        legend.visible: false
        backgroundRoundness: 0
        margins.top: 15
        margins.bottom: 1
        margins.left: 1
        margins.right: 1
        backgroundColor: "black"

        ValueAxis
        {
            id:x_axis_3
            min: 0
            max: 50
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis_3
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        ValueAxis
        {
            id:y_axis_right_3
            min: 0
            max: 5
            tickCount: 6
            visible: false
        }

        LineSeries
        {
            id:l1_3
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 3.5
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+0 }
        }

        LineSeries
        {
            id:l2_3
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            width: 2
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+10; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+20; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+30; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+0 }
            XYPoint { x: x_variable_chrt_1+40; y: y_variable_chrt_1+5 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+5 }
        }

        LineSeries
        {
            id:l3_3
            axisX: x_axis
            axisY: y_axis
            color: "#969FB2"
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+3.34 }
            XYPoint { x: x_variable_chrt_1+0; y: y_variable_chrt_1+1.67 }
            XYPoint { x: x_variable_chrt_1+50; y: y_variable_chrt_1+1.67 }
            style: Qt.DotLine
        }
    }

}

Any idea why this error ?

[Bhushan_Sure]

@dheerendra @LeLev @Nikhilesh-N @J-Hilk Anything wrong i have done here ?

[J.Hilk]

Hi @Bhushan_Sure
sadly I can't test your example, as soon as a add the 2nd Chartview, the application crashes. Works fine with 1, but not with 2 or more.

[ODБOï]

@Bhushan_Sure

you can use layouts to get rid of Binding loop

import QtQuick 2.12
import QtQuick.Window 2.2
import QtQuick.Controls 2.4
import QtQuick.Window 2.3
import QtQuick.Layouts 1.3
import QtCharts 2.3
import QtQuick.Controls.Styles 1.4

ApplicationWindow {
    visible: true
    width: 640
    height: 480

   Component{
       id:c
    ChartView {

        antialiasing: true
            ValueAxis {
            id: axisX
            min: 0
            max: 10
        }
        ValueAxis {
            id: axisY
            min: 0
            max: 1
        }

        LineSeries{
            id:vals
            axisX: axisX
            axisY: axisY
            visible: true
            width:3
            capStyle:  Qt.DashDotDotLine
        }

    }
   }

   ColumnLayout{
       anchors.fill: parent
    Loader{
        sourceComponent: c
        Layout.preferredHeight: parent.height/3
        Layout.preferredWidth: parent.width
    }
    Loader{
        sourceComponent: c
        Layout.preferredHeight: parent.height/3
        Layout.preferredWidth: parent.width
    }
    Loader{
        sourceComponent: c
        Layout.preferredHeight: parent.height/3
        Layout.preferredWidth: parent.width
    }
   }
}

[Bhushan_Sure]

@J.Hilk is it something wrong i have coded ? or anything you could suggest me ?

[Bhushan_Sure]

@LeLev Ok I will try this code to run

[Bhushan_Sure]

@dheerendra @LeLev @J-Hilk
Hi i solved the issued
Thank you so much for your Valuable inputs.

Given code is :-

import QtQuick 2.9
import QtQuick.Window 2.3

Window
{
    visible: true
    width: 400
    height: 600
    title: qsTr("Hello World")

    Loader
    {
        id:l1
        source: "Graph_1.qml"
        height: parent.height/3
        width: parent.width
    }

    Loader
    {
        id:l2
        source: "Graph_2.qml"
        height: parent.height/3
        width: parent.width
        anchors.top: l1.bottom
    }

    Loader
    {
        id:l3
        source: "Graph_3.qml"
        height: parent.height/3
        width: parent.width
        anchors.top: l2.bottom
    }

}

And Here Graph_1,Graph_2,Graph_3 are invidual graphs that i have to show.
that is 3 chartview.