Sathish,
I'll try explaining some of the concepts again and include better examples - I think we're just missing each other.
1. In Essential JS 1 I could set the tool and drawType properties as follows to be able to free form draw lines, without caps or shapes (connecting to nothing):
tool: ej.datavisualization.Diagram.Tool.DrawOnce | ej.datavisualization.Diagram.Tool.SingleSelect | ej.datavisualization.Diagram.Tool.MultipleSelect
drawType: , { type: 'connector', segments: [ { type: ej.datavisualization.Diagram.ConnectorType.Polyline} ]}
Allowing users to define a boundary within a diagram that describes a physical location for mining activities (pictured, the dashed line was drawn with this tool introduced by Shyam in Essential JS 1 using the tool and drawType configuration above.)
The difference in the Connector Tool for Xamarin Forms is that it only provides for segment types and connections between
shapes and ports of nodes. Activating the Connector Tool mode (using the SampleBrowser.SfDiagram Drawing Tool sample shipped in 17.1.0.38) does not allow me to draw a line on the diagram as I did with Essential JS (activate the connector tool in the sample, draw a line that does not connect any other nodes or ports to simulate recreating the behavior above.)
2. Serializing the sample (using the SampleBrowser.SfDiagram Organization Chart sample shipped in 17.1.0.38) results in an exception (toggle the Overview to trigger image save and JSON output.) - using the same method in a sample not using a custom model worked. There are some similarities to the Essentials JS model that might help with building a translation bridge for my application.
System.Runtime.Serialization.SerializationException: Type 'DiagramEmployee' with data contract name 'DiagramEmployee:http://schemas.datacontract.org/2004/07/' is not expected. Add any types not known statically to the list of known types - for example, by using the KnownTypeAttribute attribute or by adding them to the list of known types passed to DataContractSerializer.
at System.Runtime.Serialization.XmlObjectSerializerWriteContext.SerializeAndVerifyType(DataContract dataContract, XmlWriterDelegator x...
3. Using your sample for SVG - I think I can make that work, though I'll probably use more templates. Related to 2., I see when serializing the sample node that the pathData property can be found in the JSON expression of the node. That would be more inline with SVG template support within Essential JS Diagram - is custom SVG node support then on the roadmap?
Exporting the sample, you can see the backing model has the property:
{"connectors":[],"height":862,"nodes":[{"borderColor":"rgb(0,0,0)","borderWidth":2,"content":"svg","height":500,"isDraggingEnabled":"True","isExpanded":true,"isResizingEnabled":"True","isRotationEnabled":"True","isTextEditingEnabled":"True","labels":[{"annotationPositions":"Alignment","fontFamily":".SF UI Text","fontSize":12,"horizontalAlignment":"Center","isAligned":false,"offsetX":0,"offsetY":0,"text":"","textBrush":"rgb(0,0,0)","verticalAlignment":"Center"}],"name":"1","offsetX":25,"offsetY":25,"opacity":1,"pathData":"","ports":[],"solidBrushColor":"rgb(1,1,1)","type":"basic","width":500}],"pagesettings":{"backgroundColor":"rgb(1,1,1)","pageHeight":0,"pageWidth":0},"width":1200}
4. Using your sample I added a few dozen circle shapes with labels and then exported - you'll see the attached screenshot and then the exported image. If you view each and zoom in 30 percent you'll see the image quality difference (the simplest example for me) - for the diagrams that we export from Essential JS using SVG, we're able to crop dead space, fit to the page and also adjust the print preview/view window of the SVG document to ensure best fit and visibility of the diagram shapes and annotations - the XF Diagram image export doesn't retain the quality - hence the need for SVG in XF as we have in Essential JS.
To recap:
1. We want to draw lines that are free form paths of points that do not connect to ports or nodes - as we can within Essential JS.
2. There may be an issue with serializing diagrams that use custom models - this can be reproduced from the XF Sample Browser using the Organization Chart.
3. Your sample appears viable, thank you.
4. SVG support in nodes and export is an issue. The
Essential JS support for it is great and should be a high priority for porting to the XF implementation. An image export does not retain the quality of the original and does not scale without image quality loss.
Thank you.
Robert
Attachment:
SampleUpdated_7d342005.7z
