selectedStyle

Lorsqu'un élément est sélectionné, son modèle visuel est remplacé par le style selectedStyle qui lui est affecté. Pour affecter un style selectedStyle, vous devez ajouter cette propriété pour chaque composant du modèle qui doit être modifié.
[{
   dojoAttachPoint: '_path',
   shape: {
     type: 'polyline',
     points: [{
       x: 0,
       y: 0
     }, {
       x: 100,
       y: 0
     }]
   },
   stroke: {
     width: '{{strokeWidth}}',
     color: '{{strokeColor}}'
   },
   selectedStyle: {
     stroke: {
       width: '{{selectedStrokeWidth}}',
       color: '{{selectedStrokeColor}}'
     }
  }
}]
La propriété selectedStyle peut également être définie à l'aide d'un programme :
shape.selectedStyle = dojo.fromJson("{stroke:{ width: 2, color: '#FF0000'}}")
Les éléments sélectionnés sont stockés dans un objet Selection auquel on peut accéder par le biais de la méthode getSelection depuis le diagramme. Les éléments sélectionnés peuvent être ajoutés ou supprimés de l'objet Selection à l'aide des méthodes add, remove et clear. Ces méthodes acceptent un objet GFX ou DataItems. L'objet Selection peut également être configuré pour activer ou désactiver la multisélection :
Diagram.getSelection().setMultiSelectionEnabled(false);
Le mode de sélection est déterminé lors de la création en fonction de la présence de dataStore. Si vous utilisez un diagramme et qu'un dataStore est présent lors de la création, la stratégie dataStore est sélectionnée lorsque des éléments de données sont utilisés comme composant principal de la sélection. Lorsque des éléments GFX sont utilisés comme composant principal de la sélection, c'est la stratégie GFX qui est utilisée. Cette stratégie peut être définie manuellement lors de la création par le biais du balisage de diagramme selectionMode.
<div selectionMode="ibm_ilog.diagram.Selection.dataStore_single" dojoType='ibm_ilog.diagram.widget.Diagram' nodesStore="process" ... />
Pour définir le mode de sélection, vous pouvez utiliser les constantes suivantes définies dans Selection.js :
ibm_ilog.diagram.Selection.standard = 0;
ibm_ilog.diagram.Selection.dataStore_single = 1;
ibm_ilog.diagram.Selection.dataStore_multi = 2;
ibm_ilog.diagram.Selection.gfx_single = 3;
ibm_ilog.diagram.Selection.gfx_multi = 4;
Chaque fois que la sélection est modifiée, la méthode onSelectionChanged([added],[removed]) est appelée. Par le biais de cette méthode, vous pouvez appeler une fonction personnalisée. Dans l'exemple suivant, le diagramme est centré sur les éléments sélectionnés :
dojo.connect(Diagram.getSelection(),"onSelectionChanged",this,function(added,removed){
                if(centerOnNode) {
                    if(added.length==1) {
                        Diagram.centerOnNode(added[0],true);
                    }
                }
            });