Code Project | Adobe Flash | Animation

Creating animations with Dundas Chart for ASP.

NET - CodeProject

Sign up for our free weekly Web Developer Newsletter.

9,541,586 members (38,376 online)

in

Sign

×

home

articles

quick answers

discussions

features
Article Browse Code Stats Alternatives

community

help

Search for articles, questions, tips

Articles » Third Party Products » Product Showcase » Components and Libraries

Next Creating animations with Dundas Chart for ASP.NET

About Article
Creating Chart Animations with Dundas Chart for ASP.NET Enterprise Edition, Version 4.0 Type Licence First Posted Views Bookmarked 2 May 2004 97,485 22 times Article

By Dundas Data Visualization, 2 May 2004

Comments & Discussions (29)

Editorial Note
This article is in the Product Showcase section for our sponsors at CodeProject. These reviews are intended to provide you with information on products and services that we consider useful and of value to developers. This is a showcase review for our sponsors at CodeProject. These reviews are intended to provide you with information on products and services that we consider useful and of value to developers. Download a Dundas Chart for .NET Evaluation

ASP.NET Windows .NET Visual-Studio Dev , +

View all Dundas articles

Introduction
Dundas Chart for ASP.NET Enterprise Edition, version 4.0 now includes the tools you need to create stunning animated charts without writing a single line of code.

When to use animated charts?
Animated charts add depth to your data. They highlight valuable information and support memory retention. If you need to emphasize a Data Point when it reaches a critical value – a pressure value, high/low sales numbers, or a stock sell price - an animated chart ensures your point will be made and remembered.

Figure 1: Dundas Chart Rendering Flash Animation Dundas Chart animations are extremely useful in online marketing or presentation scenarios. They have the power to draw viewer attention to the most impactful and relevant data. Using an animated chart format to present your firm’s sales performance over time, relative to the industry standard, creates an impressive backdrop for a sales presentation

The Simplicity of Creating Animated Charts
Dundas Chart for .NET Enterprise Edition enables you to design charts without having to write any code. Using the Dundas Chart Wizard, you can design the appearance of the chart, bind it to your data source and use the Visual Studio property browser to set your animation properties.
http://www.codeproject.com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET[12/29/2012 3:21:11 PM]

Top News
Three Paradigms in Programming

the rendering format of a static chart has been selected. Chart1. how to animate it (moving.NET 2D Animated Charts ASP. Custom animations give the developer full control of an animation sequence.NET Server-Side Charting with OWC11 ASP.NET Chart with jQuery Creating and Reusing Dynamic Animations in Silverlight Fusion Charts Helper Class for ASP.RepeatDelay = 3.AnimationDuration = 7. // set to repeat the animation after a 3 second pause Chart1. the developer retains the ability to control both the time period and restart properties of the animation. Animation themes have been added to provide common animations to your chart if applicable.NET 2. Next.NET How to draw charts in asp. The chart will be rendered in Flash in the same manner that a Png or a Jpg would be rendered. Related Articles Understanding Chart Areas with Dundas Chart for .NET 4. Using the above property settings the following chart animation can be created in minutes.codeproject.NET Charting with Image Maps in MVC Generating Bar Chart in ASP. Figure 3: Selecting an Animation Theme A simple thermometer chart for ASP.NET Chart Control // set the render format to be Flash Chart1.RepeatAnimation = true.0 Chart Control ASP. // set to repeat the animation after a 3 second pause Chart1.0 (C#) Roll your own ASP. growing or fading animation) and the timing of the animation.NET Figure 4: Defining the Animation to Repeat with a delay Collapse | Copy Code Maani Chart Implementation Simplified for ASP. http://www.GrowingTogether.NET // set the Animation Theme to Grow elements together Chart1. an animation theme needs to be selected.ImageType = ChartImageType. The first step is to decide the output type: Get the Insider News free each morning.net using MS chart Using ASP.Creating animations with Dundas Chart for ASP.com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET[12/29/2012 3:21:11 PM] .NET MVC Chart Control Figure 2: Selecting the to render to Flash Collapse | Copy Code Smarter Data Labels with Dundas Chart SmartLabels AJAX features provide interactivity and zooming/scrolling to Dundas Chart Build Advanced Digital Dashboards Using Dundas Chart & Gauge Creating an Animated ContentControl ASP.CodeProject Dundas Chart for ASP.Flash.NET .AnimationTheme = AnimationThemes. it can be used to set which element is animated.NET Enterprise Edition is able to animate your data in either Flash or SVG formats. At this point. Whether using themes or custom animations. thus reducing unnecessary development. or a custom animation must be created.NET Applications Google Charts in ASP.NET Charting Controls Improve ASP.

AxisLine). However. the chart area axis lines and grid lines are removed from the GrowingTogether animation theme. The StartPositionX is set to be 100% of the width of the chart so that the text is initially out of view. seriesAnimation. axesAnimation. Chart1. The above example of animation can be modified so that the line series draws independently of the animation theme. like other chart features provided.RepeatAnimation = true. // Disable axes lines and major grid lines animation // from the growing together animation theme FadingAnimation axesAnimation = new FadingAnimation(). axesAnimation. AxisAnimationElement.Add(Chart1.CodeProject Figure 5: Chart Rendered using the GrowingTogether animation theme Creating Custom Animated Charts The animation themes are perfect for making your animated charts and will satisfy the majority of your needs.GrowingTogether. AxisAnimationElement.ChartAreas["Default"]. AxisAnimationElement.StartTime = 2. The second task is to create a GrowingAnimation object and add it to the Chart Animation Collection. The result: Figure 6: Chart Rendered using a Custom Animation There are three tasks to complete.AxisY.Add(axesAnimation).AxisY. // Replace line series animation with Growing One-by-One GrowingAnimation seriesAnimation = new GrowingAnimation().AnimatedElements. to give the chart title a sliding in effect. the Enabled property will be set to false and the object will be added to the Chart Animation Collection.AxisX.Duration = 3. and the title slides in from the right. seriesAnimation. axesAnimation. Collapse | Copy Code // set the Animation Theme to Grow elements together Chart1.Enabled = false. AxisAnimationElement. This is done by creating a FadingAnimation object and adding chart elements to the animation object. http://www.Add(Chart1.AnimationDuration = 7.Add(Chart1. The StartTime and Duration is set so that this is one of the last objects to be animated.AnimatedElements.AxisX.AnimatedElements. Setting the OneByOne property to true will cause the line to grow point by point over the time specified for the animation sequence.Add(Chart1.codeproject.ChartAreas["Default"].NET .AnimatedElements. Chart1. axesAnimation. // set to repeat the animation after a 3 second pause Chart1.AxisLine).AnimationTheme = AnimationThemes.0. seriesAnimation. Custom animations provide high-end results while maintaining simplicity in development. Finally.CustomAnimation. allowing each element to be animated and sequenced as desired.Creating animations with Dundas Chart for ASP.ChartAreas["Default"]. // set to repeat the animation after a 3 second pause Chart1.ChartAreas["Default"].0.MajorGridlines).AnimatedElements. axesAnimation. a MovingAnimation object is added. The first will modify the GrowingTogether animation theme to remove the 'fading in' of the axis lines and grid lines. Moving animations provide an X and Y coordinate (in percentage of the chart) to define where the move will begin. Since the goal is to disable a set of chart elements from the animation theme.MajorGridlines). Custom animations provide full control of the chart elements.com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET[12/29/2012 3:21:11 PM] .RepeatDelay = 3. there is an easy and powerful way to customize the presentation of your data.Series["Series2"]). This animation object consists of the Line chart series.Add(Chart1.

Enabled = true. maps.NET . // Animate the title to be moving in from the right MovingAnimation titleAnimation = new MovingAnimation().Add(Chart1.Titles[0]). so to see additional examples visit the Dundas Chart Gallery (see link below). built and tested to meet the strictest requirements that developers and business managers demand.codeproject. and are all designed. Chart1. allowing for the simultaneous development of an executive dashboard by business analysts. Dundas Dashboard allows for the rapid and collaborative development of performance dashboards. titleAnimation. Dundas also offers superb. With the API provided and the ability to animate each chart element independently. gauges and graph controls.AnimatedElements.Duration = 1.codeproject. License This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves.OneByOne = true.StartTime = 8.com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET[12/29/2012 3:21:11 PM] . the developer has full creative control. A list of licenses authors might use can be found here About the Author Dundas Data Visualization United States Member Organisation 3 members Since 1992 Dundas Data Visualization has been helping companies all over the world visualize their data. letting end-users visualize their data as required. If in doubt please contact the author via the discussion board below.CustomAnimation.Add(seriesAnimation). titleAnimation. titleAnimation.StartPositionY = 7. titleAnimation. http://www.Add(titleAnimation). helping companies leverage their business intelligence (BI) solutions.0. titleAnimation. titleAnimation. The animation possibilities are far too varied to be fully demonstrated here. Chart1.CustomAnimation. The quality of our products in conjunction with our unmatched technical support.NET Enterprise Edition here.StartPositionX = 100. numerous awards and years of experience reflect Dundas Data Visualization's commitment to being the best! Article Top like http://www. IT staff and database administrators.CodeProject seriesAnimation. Our web-based dashboard software comes with wizard interfaces. an easy-to-integrate digital dashboard software solution. It also uses premier charts. The above example is a fairly simplistic custom animation. and a unique Dundas DashFlowTM process.com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET AVpC5AsT Like Tweet 1 Comments and Discussions You must Sign In to use this message board.Creating animations with Dundas Chart for ASP. world class consulting services for those companies that do not have the in-house expertise to implement their data visualization projects. Dundas products have a global reputation of being the highest quality. Our showcase product is Dundas Dashboard.5. or download a full evaluation copy of Dundas Chart for ASP.

...NET .com/Articles/6930/Creating-animations-with-Dundas-Chart-for-ASP-NET[12/29/2012 3:21:11 PM] .CodeProject Search this forum Profile popups Spacing Relaxed Relaxed Go Noise Medium Medium Layout Normal Normal Per page 25 25 Update First Prev Next Great Dundas Chart Dundas chart performance for . Re: Constructive criticism. Re: Wow.NET Winform Exception occurs in Chart Animation Re: Exception occurs in Chart Animation Re: Exception occurs in Chart Animation Animation could be used only with Svg or Macromedia Flash rendering...121229.Creating animations with Dundas Chart for ASP. Source Code Re: Source Code Wow.1 | Last Updated 3 May 2004 Layout: fixed | fluid Article Copyright 2004 by Dundas Data Visualization Everything else Copyright © CodeProject. Permalink | Advertise | Privacy | Mobile Web03 | 2..... 1999-2012 Terms of Use http://www. Spam Scum Suckers Re: Spam Scum Suckers Re: Spam Scum Suckers Re: Repeating chart question Re: Spam Scum Suckers Re: Spam Scum Suckers Re: Spam Scum Suckers Re: Spam Scum Suckers Re: Spam Scum Suckers Re: Spam Scum Suckers Last Visit: 18:00 31 Dec '99 General News Last Update: 23:17 28 Dec '12 Suggestion Question Bug Answer zyck Mizan Rahman CybSachina Midaroh Midaroh rashidpervaiz08 15:15 24 Feb '12 2:58 23 Nov '11 1:26 30 Jul '08 8:34 7 Mar '12 9:09 7 Mar '12 2:25 3 Jun '08 luismiqui 5:03 19 Jun '08 Shima1980 Joe Johnston simdor habula 14:34 20 Oct '07 5:38 24 Jan '06 6:33 30 Oct '06 14:09 16 Dec '12 5:37 25 Jun '04 5:56 6 Jul '04 12:58 4 May '04 0:32 5 May '04 13:29 3 May '04 13:53 3 May '04 13:57 3 May '04 16:36 3 May '04 13:59 3 May '04 14:41 3 May '04 5:07 4 May '04 5:44 4 May '04 5:52 4 May '04 6:03 4 May '04 1 2 Admin Next » UltimateGrid Fan Troy Marchand Anonymous Anonymous Paddy Wack David Wulff Snyp Andrew Bryan Anonymous Paddy Wack Jamie Nordmeyer Paddy Wack Jamie Nordmeyer Paddy Wack Refresh Joke Rant Use Ctrl+Left/Right to switch messages. Re: Constructive criticism.. Re: Animation could be used only with Svg or Macromedia Flash rendering. Ctrl+Up/Down to switch threads..6. Growing line Constructive criticism.. Ctrl+Shift+Left/Right to switch pages...codeproject.

Sign up to vote on this title
UsefulNot useful

Master Your Semester with Scribd & The New York Times

Special offer for students: Only $4.99/month.

Master Your Semester with a Special Offer from Scribd & The New York Times

Cancel anytime.