digraph treatmentParametersDialysateTempDiagrom {
    bgcolor=lightgray
    margin=50

    // Prefix: q - Qt component, d - Diality componenet, i - image
    // Define the main componenets
    dDialysateTempLabelValue    [shape=box,     label="LabelValue.qml\nItem",                   fontsize="30pt"];
    dDialysateTempUpIcon        [shape=box,     label="TreatmentSectionIcon.qml\nTouchRect",    fontsize="30pt"];
    dDialysateTempDownIcon      [shape=box,     label="TreatmentSectionIcon.qml\nTouchRect",    fontsize="30pt"];

    // screenshots
    iDialysateTemp              [shape=none,    label="",                       image="images/DialysateTemp.png",               fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempTitle         [shape=none,    label="",                       image="images/DialysateTempTitle.png",          fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempLabelValue    [shape=none,    label="",                       image="images/DialysateTempLabelValue.png",     fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempTopText       [shape=none,    label="",                       image="images/DialysateTempTopText.png",        fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempBottomText    [shape=none,    label="",                       image="images/DialysateTempBottomText.png",     fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempArrowColumn   [shape=none,    label="",                       image="images/arrowColumn.png",                 fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempArrowUp       [shape=none,    label="",                       image="images/arrowUp.png",                     fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];
    iDialysateTempArrowDown     [shape=none,    label="",                       image="images/arrowDown.png",                   fontcolor="#00FF21", fontsize="25pt", labelloc=t, imagescale=true];

    // qml types
    qDialysateTempRect          [shape=ellipse, label="Rectangle",                                  fontsize="30pt"];
    qDialysateTempTitle         [shape=ellipse, label="Text\nid: _title",                           fontsize="30pt"];
    qDialysateTempRow           [shape=ellipse, label="Row",                                        fontsize="30pt"];
    qDialysateTempExtraText     [shape=ellipse, label="Text\nid: _extraText\n'visible: false",      fontsize="30pt"];
    qDialysateTempColumn        [shape=ellipse, label="Column",                                     fontsize="30pt"];
    qDialysateTempTopText       [shape=ellipse, label="Text\nvTreatmentSetPoint.dialysateTemp",     fontsize="30pt"];
    qDialysateTempCenterText    [shape=ellipse, label="Text\nid: _centerText\n'visible: false'",    fontsize="30pt"];
    qDialysateTempBottomText    [shape=ellipse, label="Text\nid: _bottomText",                      fontsize="30pt"];
    qDialysateTempUnitText      [shape=ellipse, label="Text\nid: _unitText\n'visible: false'",      fontsize="30pt"];
    qDialysateTempUpImage       [shape=ellipse, label="Image\nid: _upArrowIcon",                    fontsize="30pt"];
    qDialysateTempDownImage     [shape=ellipse, label="Image\nid: _downArrowIcon",                  fontsize="30pt"];

    // Diagram Layout
    subgraph cluster_one {
        label="Dialysate Temp."
        fontsize="30pt"
        labeljust=l

        iDialysateTemp -> qDialysateTempRect[color="red"]
        qDialysateTempRect -> qDialysateTempTitle -> iDialysateTempTitle
        qDialysateTempRect -> qDialysateTempExtraText
        qDialysateTempRect -> qDialysateTempRow  

        qDialysateTempRow -> dDialysateTempLabelValue -> iDialysateTempLabelValue
        iDialysateTempLabelValue -> qDialysateTempTopText -> iDialysateTempTopText
        iDialysateTempLabelValue -> qDialysateTempCenterText 
        iDialysateTempLabelValue -> qDialysateTempBottomText -> iDialysateTempBottomText
        iDialysateTempLabelValue -> qDialysateTempUnitText   

        qDialysateTempRow -> qDialysateTempColumn -> iDialysateTempArrowColumn
        iDialysateTempArrowColumn -> dDialysateTempUpIcon -> qDialysateTempUpImage -> iDialysateTempArrowUp
        iDialysateTempArrowColumn -> dDialysateTempDownIcon -> qDialysateTempDownImage -> iDialysateTempArrowDown
    }
}