Diagram save into the Database

[Abdul Aziz]

Hi,

I am using Syncfusion evaluation version, curently I am evaluating syncfusion diagram. I want to save diagram into the database and also retrive from the database instead of local harddisk. I am highly appreaciting if any one give some sample application.

Thanks,

[J.Nagarajan]

Hi Abdul,

The diagram can be serialized in XML format using the Diagram.SaveSoap/LoadSoap methods. You can also save and load the diagram in the database. Please refer to the following code snippet

DataTable dt;
private void menuItem2_Click(object sender, System.EventArgs e)
{
dt = new DataTable();
dt.Columns.Add("Diagram",typeof(object));
DataRow row = dt.NewRow();
row["Diagram"] = this.diagram1;
dt.Rows.Add(row);
dt.AcceptChanges();
}

private void menuItem3_Click(object sender, System.EventArgs e)
{
Syncfusion.Windows.Forms.Diagram.Controls.Diagram d1= dt.Rows[0]["Diagram"] as Syncfusion.Windows.Forms.Diagram.Controls.Diagram ;
d1.SaveBinary("d1");
this.diagram2.LoadBinary("d1");
this.diagram2.Controller.View.Grid.Visible=false;
this.diagram2.Controller.UpdateAllViews();

}

I have attached the sample for your reference. In this sample when you click on the DataTable->SetData, you can create a DataTable and DataRows. When you click on the DataTable->GetData then you can load the diagram and it will display in Diagram2.

I hope this will meet your requirement. Please do the following to run the sample

1.Execute the sample
2.Click DataTable->SetData to create the DataTable
3. Click DataTable->GetData to save and load the Diagram

You can Download this sample from the following page.

http://websamples.syncfusion.com/samples/Diagram.Windows/F57445/main.htm

Please refer to this sample and let me know if you have any questions.

Thanks for using Syncfusion product.

Regards,
Nagaraj

[sam]

Hi, 

I'm using syncfusion diagram web control to make BPM for my application, How can I pass the diagram web control value(BPM Image) to server side

Regards,

Sambath

[Shyam G]

Hi Sambath,

Please confirm us whether you need to set the Bitmap image in diagram background in the server side or you need to create a BPMN node in the server side.  

Regards,

Shyam G 

[Megatron]

Hi I have same need for ASP MVC

[Shyam G]

Hi Megatron,

As mentioned in our previous update, please confirm us whether you need to set the Bitmap image in diagram background in the server side or you need to create a BPMN node in the server side.

Regards,
Shyam G

[Megatron]

Hi, I am talking about nodes and the directional business process flows.
How can I parse and detect an disconnected/open node.

thanks

[Megatron]

I want to save both the diagram, and an image, so that I can show the user a picture before he opens the diagram.

Before I send to server for save, I want to check for errors like disconnected/orphaned nodes before I save the images.

If there are errors I want to prompt the user with the list of error and pertinent node information (Text) and ask to proceed/continue and save or cancel and fix.

thanks

[Shyam G]

Hi Megatron,

We have created a simple flow sample to achieve your requirement. Also before sending the JSON data to server, you can use node’s inEdges and outEdges property to get the connections(connected/disconnected nodes) which is coming in/out of the nodes. Also you can use exportDiagram API method to export the diagram as an image. Please refer to the below code example.

Code example:

  function save() {        

        var diagram = $("#diagram1").ejDiagram("instance");

        var saving = diagram.save();

        for (i = 0; i < saving.nodes.length; i++) {

            var node = saving.nodes[i];

            //iterate the node inEdges

            for (j = 0; j < node.inEdges.length; j++) {

            }

            //iterate the node outEdges

            for (k = 0; k < node.outEdges.length; k++) {

            }

        }

  //to get an image URL

  var image = exportDiagram();
    }

  function exportDiagram() {

        var diagram = $("#diagram1").ejDiagram("instance");

        var options = {

            fileName: "diagram",

            //Specifies whether to export as files/data

            mode: "data"

        };

        var dataURL = diagram.exportDiagram(options);

        return dataURL;
    }
Sample:http://www.syncfusion.com/downloads/support/forum/123562/ze/serializesavesample1023352543

Regards,
Shyam G

[Shyam G]

Hi Megatron,

You can refer the below help documentation link to know more about exporting the diagram.

Help documentation:http://help.syncfusion.com/js/diagram/exporting

Regards,
Shyam G