About to bing strokeDashArray,how to convert a Array class to a string?

GoJS
1

Convert a geometric class to a string: Point.stringify, Size.stringify, Rect.stringify, Margin.stringify, Spot.stringify, and Geometry.stringify.
For example:

new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify)

Q1:
I met a error:
property set error: Error: Shape.strokeDashArray:value value is not an instance of Array: “5 2”
My Code:

new go.Binding("strokeDashArray","dashes").makeTwoWay()

How to convert a Array class to a string?

2

Your Binding looks correct to me, so the problem must be in the data that you are supplying. You need to make sure that the value of data.dashes is either undefined, null or an Array. It should not be a string, which appears to be the problem that is causing your error.

Examples:

model.nodeDataArray = [
  // if there's no "dashes" property or if the property value is undefined,
  // the Binding won't try to set Shape.strokeDashArray:
  { ... },
  // usually the "dashes" property if present will be an Array:
  { ..., dashes: [5, 2] },
  // but sometimes it can be null, if you don't want a dashed line:
  { ..., dashes: null }
];
3

Array can change to String?

new go.Binding("strokeDashArray", "dashes", go.Array.parse).makeTwoWay(go.Array.stringify)
4

Array is not something that GoJS defines, nor does GoJS add an Array.parse or Array.stringify function.

5

Binding.parseEnum(ctor, defval) and Binding.toString(val) can help me to change the array to string?

6

If you have already tried them, I think the answer would be “no”. Sorry. But it should be easy for you to implement yourself.

However, I’m curious why you need to represent the Array as a string and do the Binding conversions. It’s certainly not needed for serialization to/from JSON-formatted text. Model.toJson and Model.fromJson handle Arrays of numbers just fine.

7

BecauseI want the link to have its own default value:

myDiagram.linkTemplateMap.add("ASSISTENT_LINE", 
        g_(go.Link, {
            selectionAdorned: true,
            toShortLength: 0,
            routing: go.Link.AvoidsNodes,//go.Link.Orthogonal,AvoidsNodes
            reshapable: true,
            resegmentable: true,
            relinkableFrom: true,
            relinkableTo: true
        }, 
        new go.Binding("points","points").makeTwoWay(),
        new go.Binding("text","isinc").makeTwoWay(), 
        new go.Binding("text","length").makeTwoWay(),
        g_(go.Shape, {
            stroke: "rgba(0,0,0,1)",
            strokeWidth: 2,
            strokeDashArray: [5,2],
        }, 
        new go.Binding("strokeWidth","linkThickness").makeTwoWay(), 
        new go.Binding("strokeDashArray","dashes").makeTwoWay(), 
        new go.Binding("stroke","linkColor").makeTwoWay()), 
        g_(go.TextBlock, {
            text:"DASH",
            font:"bold 8pt helvetica, bold arial, sans-serif",
            stroke:"#000000",
            segmentOffset:new go.Point(0, 0),
            editable: true,
            _isNodeLabel: true,
            cursor: "pointer"
        }, 
        new go.Binding("segmentOffset", "segmentoffset", go.Point.parse).makeTwoWay(go.Point.stringify), 
        new go.Binding("font","lableFont").makeTwoWay(), 
        new go.Binding("stroke","lableColor").makeTwoWay(), 
        new go.Binding("text","lable").makeTwoWay())));
8

That’s easy – just set it. And your code does that, so I don’t know why your link path Shape isn’t “dashed” by default.

I just tried it by modifying a Link template as follows:

      $(go.Link, . . .,
        $(go.Shape,
          { strokeDashArray: [5, 2] },
          new go.Binding("strokeDashArray", "dashes"),
          . . .),
        . . .
      )

and I provided model data as follows:

    model.linkDataArray = [
      { from: 1, to: 2 },
      { from: 1, to: 3, dashes: [12, 12] },
    ];

And all of that worked as I think both of us would expect.

I am curious why you have the Binding be a TwoWay Binding. Do you have some code that sets that Shape.strokeDashArray property?
https://gojs.net/latest/intro/dataBinding.html#ReasonsForTwoWayBindings

9

I want the link to have its own default value. How do I handle that?
Can I ignore the from and to of link:

 var linkDataArray = [
   { category: "ASSISTENT_LINE", text: "DASH",font:"...",... },
   { category: "ASSISTENT_LINE1", text: "DASH1",font:"...",... },  
 ];
10

Setting a property on a template does set its default value – all instances of that object (a Shape in this case) will have that property value, unless it is replaced by the evaluation of a Binding on that property.

11

Q1:What is e?

Q2:When I print e,the result as shown in the figure :

How do I get the datumI want?
And what do these datum represent?

12

I used the inspector,so have the Binding be a TwoWay Binding.

13

All DiagramEvent listeners get an instance of DiagramEvent | GoJS API.

For the Data Inspector, did you specify the type of the “dashes” property to be something like:

new Inspector("myInspector", myDiagram,
  { . . .,
    properties: {
      . . .,
      "dashes": { type: "arrayofnumber" }
    }
  }
)