Setting up ImageMap Mode

In order to use ImageMap mode, set ClientSideMode to ImageMap and add ImageGen.ashx and the accompanying code file to your ASP.NET project.

• ImageGen files
  After the NetDiagram installation, ImageGen files are located in the NetDiagram\Redistributable folder.

Alternatively, instead of adding external files to the project, you could list NetDiagram's image generator class in web.config:

XML

<handlers>
    <add name="ImageHandler" path="ImageGen.ashx" verb="GET"
        type="MindFusion.Common.WebForms.ImageHandler, MindFusion.Common.WebForms"/>
</handlers>

To choose the format of the diagram image generated by NetDiagram, set the ImageFormat property to the respective image MIME type (the default is image/jpeg). When using jpeg format, you can also specify the image quality by means of the ImageQuality property. The quality values range from 1 to 100, where 1 specifies the highest possible compression at the price of a great image quality loss, and 100 specifies the highest possible quality, but without compression.

GDI.NET cannot create Image objects larger than about 3000 x 3000 pixels. To avoid this problem, NetDiagram can split a large diagram image into smaller ones, and render them inside an HTML table. To enable this, set MaxImageSize to a value different from Size.Empty.

When ClientSideMode is set to ImageMap, perform the following steps to enable user interaction:

• Add MindFusion.Extenders.dll reference to the Web Site project;
• Place an InteractivityExtender instance on the page;
• Set the extender's TargetControlID property to the ID of the DiagramView control;

When user interaction is enable and the user releases the mouse button, the coordinates are sent to the server, the diagram image is rendered according to the changes made on the diagram and sent back to the browser. Some of the following events are raised on the server side: NodeCreated, NodeModified, LinkCreated, LinkModified.

Tip
When using ImageMap client side interactivity, place the DiagramView inside an UpdatePanel, in order to refresh only the diagram control when the user draws an item and avoid reloading the whole page.