Dundas Chart for ASP.NET
Using Flash Rendering
See Also Send comments on this topic.
Using Dundas Chart > Rendering > Using Flash Rendering



Glossary Item Box

Overview

Enterprise Edition Only Feature.

Flash is a vector graphics based animation program, owned by Adobe (formerly Macromedia), and freely available to the public. Flash files are often used in web pages to display animated graphics, but they can also be played using the standalone Flash player. This topic discusses techniques, advantages, and disadvantages of using this media format to display your charts.

 

Advantages vs. Disadvantages of Using Flash

Advantages

These are the advantages to using Flash:

 

Disadvantages

These are the disadvantages to using Flash:

 

Features Not Available When Using FlashCursors and Range Selections

The following chart features are not available when you use Flash:

 

Rendering as Flash

To render a chart as a Flash image, simply set this option in the ImageType property. This can be done either from within the Property Browser, or programmatically as demonstrated below.

 

Note
By default Flash version 4 is used. However, if tooltips are enabled, then version 6 will get used instead.

 

Using A Flash Image As A Link

When the image type property is set to render the Chart as a Flash image, and you want to use that image as a hyperlink, then the it is worthy to mention that the Flash image link will be resolved as if it were a link to an external page. For example, if you set the image's Href property to

Href = "test.html"

 

then it will be resolved as if it were set as:

Href = "http://test.html"

 

this means that it will try to launch an external page called "test.html" rather than looking for a page called "test.html" in your application's root directory.

The following code demonstrates how to set the Href property of a Flash image so it will link to an internal page located within the root directory of the application. The method demonstrated below simply hardcodes the name of the html page, and dynamically acquires the local host application path, then concatenates the pieces together to create a valid URL for the Href property.

Chart1.Titles[0].Href = @"http://" + Request.Url.Authority + Request.ApplicationPath + @"/test.html";

Example

This example demonstrates how to set the ImageType property to Flash programmatically.

Visual Basic Copy Code
Imports Dundas.Charting.WebControl
   ...
   
' Set the ImageType to render using Flash format.
Chart1.ImageType = ChartImageType.Flash
C# Copy Code
using Dundas.Charting.WebControl;
   ...
   
// Set the ImageType to render using Flash format.
Chart1.ImageType = ChartImageType.Flash;

 

Chart Scaling

When a Flash file is rendered in a browser, there is the possibility that the picture could be resized as the browser is resized. To activate automatic resizing, the height and width of the chart should be set as a percentage of the browser size. This can be done using the width and height <IMG> attributes that are set using the Chart.Attributes property.

An additional attribute, PreserveAspectRatio, will maintain the proportions of Height and Width settings accordingly thereby preventing distortion as the image is dynamically resized.

 

Note
Tooltips are disabled when you use a Flash-resizable picture.

 

Example

This example demonstrates how to set the chart's scaling attributes. We assume that a chart called Chart1 has been added to the project, then we proceed to set the width, height, and aspect ratio attributes.

Visual Basic Copy Code
Imports Dundas.Charting.WebControl
   ...
   
' Enable resizing of Flash Document.
Chart1.Attributes("Height") = "70%"
Chart1.Attributes("Width") = "70%"

' Resizable picture should keep aspect ratio.
Chart1.Attributes.Add("preserveAspectRatio","true")
C# Copy Code
using Dundas.Charting.WebControl;
   ...
   
// Enable resizing of Flash Document.
Chart1.Attributes["Height"] = "70%";
Chart1.Attributes["Width"] = "70%";

// Resizable picture should keep aspect ratio.
Chart1.Attributes.Add("preserveAspectRatio","true");

 

Explicitly Saving Flash Files

In cases where the chart image needs to be saved, you can use the Save method of the Chart object. Either of the Save methods below can be used to save an XML formatted Flash chart to a file for later use:

Visual Basic Copy Code
Imports Dundas.Charting.WebControl
   ...
   
Public Overloads Sub Save(ByVal imageFileName As String, ByVal format As ChartImageFormat)
Public Overloads Sub Save(ByVal FlashStream As Stream, ByVal format As ChartImageFormat)
C# Copy Code
using Dundas.Charting.WebControl;
   ...
   
public void Save(string imageFileName, ChartImageFormat format );
public void Save(Stream FlashStream, ChartImageFormat format );

 

Example

This example demonstrates how to save a chart as a Flash file.

Visual Basic Copy Code
' Save the Chart in Flash Format.
Chart1.Save("FlashChartImage.swf", ChartImageFormat.Flash)
C# Copy Code
using Dundas.Charting.WebControl;
   ...
   
// Save the Chart in Flash Format.
Chart1.Save("FlashChartImage.swf", ChartImageFormat.Flash);

 

Custom Painting Using Flash

Custom drawing is implemented using the Paint and PostPaint events. Flash custom drawing uses the same set of methods as painting does in other non-vector formats. Any custom drawn element may have an Href link, tooltips, or both.

Example

This example demonstrates how to use the Paint event to draw two circles, which are then made selectable, and have tooltips.

Visual Basic Copy Code
Imports Dundas.Charting.WebControl
   ...
   
If(sender = ChartArea) Then
    ' Initialize a hot region. All elements drawn before the EndHotRegion area
    ' will be selectable and have the same tooltip assigned to them.
    ChartGraphics.StartHotRegion("www.dundas.com", "Dundas Software")
    
    ' Get the drawing rectangle for the first ellipse.
    Dim ellipseRect As RectangleF = e.ChartGraphics.GetAbsoluteRectangle(New RectangleF(10, 10, 20, 20))
    
    ' Draw the first ellipse.
    e.ChartGraphics.DrawEllipse(New Pen(Color.Red), ellipseRect)
    
    ' Get the next ellipse rectangle.
    ellipseRect = e.ChartGraphics.GetAbsoluteRectangle(New RectangleF(5, 5, 10, 10))
    
    ' Draw the next ellipse.
    e.ChartGraphics.DrawEllipse(New Pen(Color.Red), ellipseRect)
    
    ' End the hot region.
    e.ChartGraphics.EndHotRegion
End If
C# Copy Code
using Dundas.Charting.WebControl; 
    ... 
    
if(sender is ChartArea)
{
  // Initialize a hot region. All elements drawn before the EndHotRegion area
  // will be selectable and have the same tooltip assigned to them.
  ChartGraphics.StartHotRegion( "www.dundas.com", "Dundas Software");
  
  // Get the drawing rectangle for the first ellipse.
  RectangleF ellipseRect = e.ChartGraphics.GetAbsoluteRectangle( new RectangleF( 10, 10, 20, 20 ));
  
  // Draw the first ellipse.
  e.ChartGraphics.DrawEllipse( new Pen(Color.Red),ellipseRect);
  
  // Get the next ellipse rectangle.
  ellipseRect = e.ChartGraphics.GetAbsoluteRectangle( new RectangleF( 5, 5, 10, 10 ));
  
  // Draw the next ellipse.
  e.ChartGraphics.DrawEllipse( new Pen(Color.Red),ellipseRect);
  
  // End the hot region.
  e.ChartGraphics.EndHotRegion();
}

 

Drawing using a transparent color can be used to create selectable regions or regions with a specific tooltip that are not visible when the chart is rendered. Similar to the above sample the code must begin with StartHotRegion method and end with EndHotRegion methods. All drawing will be done in the same way but will be done using the transparent color. 

Binary Streaming Flash

Similar to rendering charts in a typical image format, you are able to render a Flash chart using either Binary Streaming or as an Image Tag. When rendering using binary streaming the html tag is slightly different.

Rendering using binary streaming is very similar to binary rendering of normal images (png, jpeg, bmp, see the Rendering Methods topic for further information). The difference is that when rendered as an image, the tag will be an html <img> tag. When rendered using binary streaming, an <embed> tag is used.

Example

This example demonstrates how to add the download link for the Flash image viewer plugin file.

HTML Copy Code
<object width="500" height="300" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" >
        <param name="movie" value="WebForm3.aspx" />
        <embed src="WebForm3.aspx" pluginspage="http://www.macromedia.com/go/getflashplayer" width="500" height="300" type="application/x-shockwave-flash" >
        </embed>
</object>

See Also

Copyright © 2001 - 2009 Dundas Data Visualization, Inc. and others.