Ajax Control ToolkitAjax Control Toolkit Samples & Demos

Ajax contorl toolkit LineChart Demonstration

LineChart Demonstration

Basic Type:

Stacked Type:

LineChart Description

The LineChart control enables you to render a line chart from one or more series of values. This control is compatible with any browser which supports SVG including Internet Explorer 9 and above.


This control can display two types of LineCharts: Basic and Stacked.

LineChart Properties

The control above is initialized with this code. The italic properties are optional:

<ajaxToolkit:LineChart ID="LineChart1" runat="server" 
ChartWidth="450" ChartHeight="300" ChartType="Basic" 
ChartTitle="United States versus European Widget Production" 
CategoriesAxis="2007,2008,2009,2010,2011,2012" 
ChartTitleColor="#0E426C" CategoryAxisLineColor="#D08AD9" 
ValueAxisLineColor="#D08AD9" BaseLineColor="#A156AB">
<Series>
    <ajaxToolkit:LineChartSeries Name="United States" 
    LineColor="#6C1E83" Data="110, 189, 255, 95, 107, 140" />
    <ajaxToolkit:LineChartSeries Name="Europe"  
    LineColor="#D08AD9" Data="49, 77, 95, 68, 70, 79" />
</Series>
</ajaxToolkit:LineChart>
    
LineChart Properties
  • ChartHeight - This property enables you to customize the height of the chart.
  • ChartWidth - This property enables you to customize the width of the chart.
  • ChartTitle - This property enables you to set the title of the chart.
  • CategoryAxis - This is a required property. You need to provide a set of values for the category axis to create a line chart.
  • ChartType - This property enables you to render two types of line charts 1. Basic 2. Stacked.
  • Theme - This property enables you to control the appearance of the line chart with a Cascading Style Sheet file.
  • ValueAxisLines - This property enables you to set the interval size for the value axis line.
  • ChartTitleColor - This property enables you to set the font color of the chart title.
  • CategoryAxisLineColor - This property enables you to set the color of the category axis lines.
  • ValueAxisLineColor - This property enables you to set the the color of the value axis lines.
  • BaseLineColor - This property enables you to set the color of the base lines of the chart.
  • TooltipBackgroundColor - This property enables you to set the background color of the tooltip box.
  • TooltipFontColor - This property enables you to set the font color of the tooltip box.
  • TooltipBorderColor - This property enables you to set the border color of the tooltip box.
  • AreaDataLabel - This property enables you to set the text/label that will be shown in the tooltip and describe about area data value.

LineChartSeries Properties:
  • Name - This property is required.
  • Data - This property is required and provides data for a particular series.
  • LineColor - This property enables you to set the color of line for a particular series.

Ajax control toolkit LineChart example with demo in asp .net

In this asp .net tuotiral you will learn about ajax control toolkit LineChart,ajax control toolkit LineChart Extender,ajax control toolkit pie chart sample,ajax control toolkit LineChart Demo,ajax control toolkit LineChart with database,ajax control toolkit LineChart tutorial