Podem ser criados usando conectores de máquina de estado.
$render = '';
$resposta = '';
dc.cw("Diagram", "widget_diagrama", {
id: "diagrama"
, defaultConnector: ['StateMachine', {
curviness: 10
, margin: 5
, proximityLimit: 80
, loopbackRadius: 25
, showLoopback: true
, orientation: 'anticlockwise'
}]
, containment: true
, paintStyle: {
stroke: '#7D7463'
, strokeWidth: 3
}
, maxConnections: -1
, endPoints: [{
uuid: '38afb51c-cdd4-401e-b899-fc9403e086b7'
, element: 'diagrama-770c8a6a-9cbe-4456-bd9b-f114a2de3479'
, anchor: 'Bottom'
, endpoint: ['Blank', {}]
}, {
uuid: 'f055a94c-daf0-4dfc-8612-e8093831dbcb'
, element: 'diagrama-916f4c50-789b-455a-8f12-0a348b58e168'
, anchor: 'Top'
, endpoint: ['Blank', {}]
}, {
uuid: '75c57074-0808-47dc-99ad-47c087e1d742'
, element: 'diagrama-916f4c50-789b-455a-8f12-0a348b58e168'
, anchor: 'BottomRight'
, endpoint: ['Blank', {}]
}, {
uuid: 'c418bb3a-1847-4b3d-8eb8-db97b6210f70'
, element: 'diagrama-916f4c50-789b-455a-8f12-0a348b58e168'
, anchor: 'BottomLeft'
, endpoint: ['Blank', {}]
}, {
uuid: 'c3833b2f-ec93-413b-af5c-f7e08becc72e'
, element: 'diagrama-0c6083e6-2820-4514-abd4-09fe9f0c048b'
, anchor: 'Top'
, endpoint: ['Blank', {}]
}, {
uuid: '6d0fd941-9c1d-4c28-9789-5104a57c0cc4'
, element: 'diagrama-0c6083e6-2820-4514-abd4-09fe9f0c048b'
, anchor: 'Right'
, endpoint: ['Blank', {}]
}, {
uuid: '8ffb7d03-277b-4728-99dd-ecf7053d2782'
, element: 'diagrama-0c6083e6-2820-4514-abd4-09fe9f0c048b'
, anchor: 'BottomRight'
, endpoint: ['Blank', {}]
}, {
uuid: '31c87b1d-02fd-40ad-b532-81551bd09a1d'
, element: 'diagrama-6a145b39-29c5-4582-a6ef-b22171cbfc7a'
, anchor: 'Left'
, endpoint: ['Blank', {}]
}, {
uuid: '1c1be8e3-e2b7-47f5-8c59-90ec4f1acda3'
, element: 'diagrama-6a145b39-29c5-4582-a6ef-b22171cbfc7a'
, anchor: 'BottomLeft'
, endpoint: ['Blank', {}]
}, {
uuid: '34498055-7b98-454f-9b5d-3ffa0e85e677'
, element: 'diagrama-6a145b39-29c5-4582-a6ef-b22171cbfc7a'
, anchor: 'Top'
, endpoint: ['Blank', {}]
}, {
uuid: '4e8644de-b24e-4926-b90b-72768dfffa99'
, element: 'diagrama-6a145b39-29c5-4582-a6ef-b22171cbfc7a'
, anchor: 'TopRight'
, endpoint: ['Blank', {}]
}, {
uuid: '393a5680-9975-4e00-a587-e2be7baf864d'
, element: 'diagrama-6a145b39-29c5-4582-a6ef-b22171cbfc7a'
, anchor: 'TopLeft'
, endpoint: ['Blank', {}]
}]
, connections: [{
uuids: ['38afb51c-cdd4-401e-b899-fc9403e086b7', 'f055a94c-daf0-4dfc-8612-e8093831dbcb']
, overlays: [['Arrow', {
location: 1.0
}]]
}, {
uuids: ['75c57074-0808-47dc-99ad-47c087e1d742', 'c3833b2f-ec93-413b-af5c-f7e08becc72e']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Ligar"
, cssClass: 'flow-label'
}]]
}, {
uuids: ['c3833b2f-ec93-413b-af5c-f7e08becc72e', 'c418bb3a-1847-4b3d-8eb8-db97b6210f70']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Desligar"
, cssClass: 'flow-label'
}]]
}, {
uuids: ['6d0fd941-9c1d-4c28-9789-5104a57c0cc4', '31c87b1d-02fd-40ad-b532-81551bd09a1d']
, overlays: [['Arrow', {
location: 1.0
}]]
}, {
uuids: ['1c1be8e3-e2b7-47f5-8c59-90ec4f1acda3', '8ffb7d03-277b-4728-99dd-ecf7053d2782']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Solicitar desligamento"
, cssClass: 'flow-label'
}]]
}, {
uuids: ['34498055-7b98-454f-9b5d-3ffa0e85e677', '34498055-7b98-454f-9b5d-3ffa0e85e677']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Andar"
, cssClass: 'flow-label'
}]]
}, {
uuids: ['4e8644de-b24e-4926-b90b-72768dfffa99', '4e8644de-b24e-4926-b90b-72768dfffa99']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Correr"
, cssClass: 'flow-label'
}]]
}, {
uuids: ['393a5680-9975-4e00-a587-e2be7baf864d', '393a5680-9975-4e00-a587-e2be7baf864d']
, overlays: [['Arrow', {
location: 1.0
}], ['Label', {
label: "Falar"
, cssClass: 'flow-label'
}]]
}]
});