Learn GoJS From Beginning - Part One

Introduction

In this article, we will explore the basics of GoJS. We will learn the basics because I have written this article focusing on beginners. Also, we will discuss how we use GoJS with ASP.NET.

• Learn GoJS From Beginning - Part One
• Learn GoJS From Beginning - Part Two
• Learn GoJS From Beginning - Part Three
• Learn GoJS From Beginning - Part Four
• Learn GoJS From Beginning - Part Five

We should have a basic knowledge of HTML and JavaScript.

Any version of Visual Studio should be installed. I recommend you use Visual Studio 2015.

GOJS

GoJS is a JavaScript library for creating custom diagrams, flowcharts, trees, and complex visualizations across all modern web browsers and technology platforms. GoJS provides many advanced features for users. GoJS is completely written in Javascript, so it's easy for developers to Understand and Implement in projects.

We can integrate GoJS in any JavaScript framework like jQuery, AngularJS, or any other JavaScript Framework.

GoJS provides a powerful solution to develop a diagram, modeling, and visualization application. By using GoJS, it’s possible to create user-friendly web applications allowing end-users to construct complex diagrams.

GoJS is used to create your inherent diagrams. It's created and maintained by Northwoods Software. Northwoods Software was founded in 1994 with a vision to provide graphical user interfaces(GUI) to the Companies and customers. Northwoods launched GoJS IN 2012.

GoJS makes constructing JavaScript diagrams of complex nodes, links, and groups easy with customizable templates and layouts.

It runs completely in the web browsers. There is no need to contact the server.

GoJS is not depended on any third party library

Using GoJS, we can create flowcharts, trees, organizational diagrams, industry specified visualizations etc.

1. Diagram Classes
2. Model Classes
3. Collection Classes
4. Layout Classes
5. Geometry Classes

Diagram Classes	Model Classes	Collection Classes	Geometry Classes
Diagram	Binding	Map	Size
Link	Model	List	Spot
Node	Transaction	Set	Rect
Shape	ChangedEvent	Iterator	Margin
TextBlock	TreeModel	Iterable	Geometry

Step 1 First, we need to include GoJS Library in our project. For this, we can download the library from the GoJS official website or download it from here.

Or we can add using NPM (Node Package Manager) using this command: $ npm install gojs --save

We also include this library using Nuget: PM>install-package Northwoods.GoJS

We can also add it from GitHub Repository from GitHub.

Step 2 Add a new item to the project.

Step 3 Add new web form and rename it as GojsDemo1.

Step 4 Now, add the GoJS library in the Head section by simply dragging from the script folder and dropping it on the page.

Now, add a div and rename it as divdemodiagram.