Introduction

Drag-able charts are a special set of charts that allow you to visually manipulate the data on a chart and then submit it back. These charts can be used intensively for simulations, financial planning, etc.

In this section, you will be introduced to the:

• Basics of drag-able charts

• Types of drag-able charts

Basics of Drag-able Charts

Drag-able charts allow you to visually morph the data to update the figures on the chart. These charts derive their basic features from the multi-series column, the multi-series line, and the multi-series area charts.

FusionCharts Suite XT offers the following three types of drag-able charts:

1. Drag-able column 2D chart

2. Drag-able line 2D chart

3. Drag-able area 2D chart

Once you are done with the visual updating of data, you can submit the data:

1. Either back to the server as form data(like HTML Forms)

2. Or, to JavaScript functions present on the same page as the chart. These JavaScript functions can then process the data and do the needful.

Types of Drag-able Charts

Drag-able Column 2D

A simple drag-able column 2D chart looks like this:

In the above chart, the Estimated Demand data plot is drag-able. A table is rendered below the chart which reflects the visually-updated data on the chart.

Drag-able Line 2D

A simple drag-line 2D chart looks like this:

In the above chart, the anchors representing the Q3 and Q4 sales estimates for Apple and Samsung are drag-able. A table is rendered below the chart which reflects the visually-updated data on the chart.

Drag-able Area 2D

A simple drag-able area 2D chart looks like this:

In the above chart, the anchors representing the Q3 and Q4 sales estimates for Apple and Samsung are drag-able. A table is rendered below the chart which reflects the visually-updated data on the chart.

There! You have now seen the basics and types of drag-able charts.