We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Diagram Tutorial

Thread ID:





119501 Jun 30,2015 11:21 PM UTC Jul 27,2015 08:52 AM UTC ASP.NET MVC 3
Tags: Diagram
Nicola Crawford
Asked On June 30, 2015 11:21 PM UTC


I have been attempting to follow your tutorial for creating a diagram and I have run into a number of problems:

The following code (copied and pasted from the tutorial) does not work in the controller - it looks like it may be JavaScript

  model.DefaultSettings.Node = new Node() {

        Width = 70,

        Height = 30,

        shape: { type: "rectangle","cornerRadius": 5 },


There is no code in the GetOrgChartData method - I would assume this should be getting some JSON from a file and converting it into the correct format for model.DataSourceSettings.DataSource, though I'm not sure what the format should be. I have tried using the JSON that is under the "Initialize Data Source" section but I can't work out how to load this correctly.

Is there a complete project for this tutorial?

Finally I tried using the JavaScript tutorial and adding that code to the .cshtml file which seems to work except when I scroll or click on the diagram it gets smaller and smaller until it is only a few pixels high.

Any help with the tutorial would be appreciated.


Shyam G [Syncfusion]
Replied On July 1, 2015 09:30 AM UTC

Hi Nichola

Thanks for using Syncfusion products.

We have modified the “Create your first diagram in MVC” document and it is not refreshed in online. We have provided the drafted version of the document in the below link. However we request you to check our website periodically for the changes in the documentation.


Please let me know if any concerns.

Shyam G

Nicola Crawford
Replied On July 23, 2015 09:47 AM UTC

Thank you for your help. I have managed to get the tutorial code working.

However I am still seeing the scrolling issue - whenever I scroll the mouse wheel in the diagram canvas or click on it when the scroll bar is visible, the canvas gets smaller and smaller until it is almost not visible. I tried using the code from the diagram demo (http://mvc.syncfusion.com/demos/web/diagram/drawingtools) and had the same issue.

Are you able to shed any light on why this might be happening?

Shyam G [Syncfusion]
Replied On July 27, 2015 08:52 AM UTC

Hi Nichola

Thanks for your update.

We have checked your reported issue in our sample and we are unable to reproduce the reported issue at our end. could you please include the latest css files in your sample and check at your end. Still if you are facing issues at your end, please get back to us we will be happy to help you. please refer the cdn link for css file below.

Css link: <link rel='nofollow' href= "http://cdn.syncfusion.com/" rel="stylesheet" />

Sample: http://www.syncfusion.com/downloads/support/forum/119501/ze/drawingtools27july-654805980

Please let me know if any concerns.

Shyam G


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon