Customizing Diagram Link Shape-s in JavaScript and React

In this blog post we will look at 3 different ways of customizing diagram links. They are:

  • Drawing one ShapeNode in the middle of the link.
  • Drawing a rectangle in the middle of a link.
  • Drawing a ShapeNode at conjunction points.

The following image illustrates DiagramLink s created by each of the three methods.

Continue reading

Using Flexbox Layout to Arrange Diagram Components in React

This tutorial demonstrates how to use the flexbox layout to arrange the various diagram controls that come with the diagram library for React. The controls we will arrange are DiagramView , NodeListView , Ruler , Overview, Zoomer and Ruler. This is a screenshot of the final application:

We build our project using the React framework and MindFusion diagram library for React available from https://www.npmjs.com/package/diagram-library-react.
Continue reading

The CanvasLayer in JavaScript Maps

In this blog post we are going to use the CanvasLayer of the JavaScript map library to build a web page that renders a city map with overlay polygons of the districts, covered by various couriers of a company. Each area is a separate in different color. Here is the final result:

Canvas Layer in MindFusion Map Control

Continue reading