Ajax Features

Introduction

This feature set enables web based zooming and scrolling as well as a user interface for end users to navigate and manipulate the chart zooming. An auto updating implementation also allows the chart to refresh with new data without reloading the web page.

Getting Started

The zoomer features can be accessed through the Chart.Zoomer class. To enable this functionality Chart.Zoomer.Enabled = true must be set. This will allow the user to zoom and navigate the chart via a context menu.

The context menu offers Zoom, Zoom in, and axes to zoom options. 'Zoom In' will automatically zoom into the chart while 'Zoom' will allow the user to select a zoom in area using the mouse.

After zooming using the context menu and selecting an area, the user can drag the chart or use the scrollbars to navigate it.

Options affecting user UI

Chart.Zoomer.DragAfterZoom
The option will determine whether dragging is automatically enabled after a chart is zoomed.

Chart.Zoomer.ScrollType
Determines the scrolling type with options including drag (click / drag), scroll (using scroll bars / arrows) or both.

Chart.Zoomer.AxisToZoom
Options include Both (can select any arbitrary bounding box to zoom to),  XAxis (select a specific x axis region only, y axis is fixed to the maximum extent) , YAxis (select a specific y axis region only, x axis is fixed to the maximum extent).

Chart.Zoomer.SelectionStyle
Determines the visual style when selecting a zoomed region.  Options include box and cross hair.  Box is more aesthetically pleasing and allows for rough selections.  Cross hair is more accurate and shows the cross hair lines extending to the axis to select a more accurate region for the zoom.

Other Options

Chart.Zoomer.UseSections
Determines if the chart image is rendered as a single image or in sections.

Chart.Zoomer.PreloadedSections
Determines the number of sections (rows / columns) outside of the viewing portal to render in advance.  This can provide a better experience for the user at the cost of performance and bandwidth (loading images that may never be viewed).

Chart.Zoomer.ReloadPeriod
The update interval for the chart in seconds.  If data is changing on the server side this interval will refresh the chart image seamlessly based on this time period.  This operation is resource intensive and should only be used if it the data for the chart is frequently changing and it is important that the viewer have the latest result immediately.

Chart.Zoomer.ToolTipDelay
Determines the amount time in seconds before the tooltip displays (if a tooltip exists for the area hovered over).

Chart.Zoomer.AjaxHandlerEnabled
By default, .netCHARTING automatically handles all calls.  If this boolean is true, a dedicated handler (ashx) page is used instead of the calling page.  This option would typically only be used if the application was very performance sensitive and is disabled by default.

Axis Viewport

The Axis.Viewport class provides properties that can be used to specify the zoom depth and position programmatically. It supports numeric, time, and category axes.  

Category Axes
With category axes, Viewport.ElementCount can be used to specify how many element groups to fit within the view at a time.

Using the Axis.Viewport properties allows specifying a starting and end position with category axes by setting the Viewport.ScaleRange. The scaleRange should be set using integers referring to the elements numerically from 0 to n elements shown.

Numeric and Time Axes
With quantitative axes, the range can be specified through Viewport.NumericRange or Viewport.TimeInterval. In addition to these properties, Viewport.ScaleRange can also be used for both and because it takes a starting and ending value, it is used to specify a range and a starting zoom position.