Essential Studio for Asp.Net | Demos

SHOWCASE SAMPLES
Showcase samples
    Chart/ Chart Customization / Annotations
    <%@ Page Title="Chart-Annotations-ASP.NET-SYNCFUSION"   Language="C#"  MetaDescription="This sample demonstrates how to render annotation for series using Syncfusion ASP.NET Web Forms Chart control" MasterPageFile="~/Samplebrowser.Master" AutoEventWireup="true" CodeBehind="Annotations.aspx.cs" Inherits="WebSampleBrowser.Chart.Annotations" %>
    
    <asp:Content ID="Content4" runat="server" ContentPlaceHolderID="SampleHeading">
        <span class="sampleName">Chart/ Chart Customization / Annotations</span>
    </asp:Content> 
    <asp:Content ID="ControlContent" runat="server" ContentPlaceHolderID="ControlsSection">
        <div id= "watermark" style="font-size:100px; display:none">2014</div>
    
    <div id= "hightemp" style="display:none" align="center">
    <img style="width:50px;" src="../Content/images/chart/sun_annotation.png" />
    <div>Highest<br/>Temperature</div>
    </div>
    
    <div id= "lowtemp" style="display:none;"align="center">
    <img style="width:50px;" src="../Content/images/chart/rain_annotation.png">
    <div>Lowest<br/>Temperature</div>
    </div>
        <div>
            <script type="text/javascript" src="../Scripts/ChartData.js"></script>
            <ej:Chart ID="Chart1" runat="server" Width="970" Height="600" IsResponsive="true" OnClientLoad="onChartLoad">
                <PrimaryXAxis Title-Text="Month" />
                <PrimaryYAxis Title-Text="Temperature (Fahrenheit)" />
                <CommonSeriesOptions EnableAnimation="True" Tooltip-Visible="false" 
                    Tooltip-Format="#point.x# : #point.y# #series.name# Medals" PieCoefficient="0.5"  />
                <Series>
                      <ej:Series Name="Temperature" Fill="#55AAFF" XName="Xvalue" YName="YValue1" Marker-DataLabel-Visible="true" Marker-DataLabel-EnableContrastColor="true"
                          Marker-DataLabel-TextPosition="Middle"  Marker-DataLabel-VerticalTextAlignment="Near"> </ej:Series>
                </Series>
                <Title Text="Temperature flow over months"></Title>
                <Annotations>
                    <ej:Annotations Visible="True" Content="watermark" Opacity="0.2" Region="Series"></ej:Annotations>
                    <ej:Annotations Visible="True" Content="lowtemp" CoordinateUnit="Points" VerticalAlignment="Top" Margin-Bottom="5"></ej:Annotations> 
                      <ej:Annotations Visible="True" Content="hightemp" CoordinateUnit="Points" VerticalAlignment="Top" Margin-Bottom="5"></ej:Annotations> 
                </Annotations>
                <Legend Visible="false"></Legend>
            </ej:Chart>
        </div>
    </asp:Content>
    
    
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace WebSampleBrowser.Chart
    {
        public partial class Annotations : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                List<AnnotationChartData> data = new List<AnnotationChartData>();
    
                data.Add(new AnnotationChartData("Jan", 60));
                data.Add(new AnnotationChartData("Feb", 50));
                data.Add(new AnnotationChartData("Mar", 64));
                data.Add(new AnnotationChartData("Apr", 63));
                data.Add(new AnnotationChartData("May", 81));
                data.Add(new AnnotationChartData("Jun", 64));
                data.Add(new AnnotationChartData("Jul", 82));
                data.Add(new AnnotationChartData("Aug", 96));
                data.Add(new AnnotationChartData("Sep", 78));
                data.Add(new AnnotationChartData("Oct", 60));
                data.Add(new AnnotationChartData("Nov", 58));
                data.Add(new AnnotationChartData("Dec", 56));
    
                //Binding Datasource to Chart
                this.Chart1.DataSource = data;
                this.Chart1.DataBind();
    
                //Setting Range for PrimaryYAxis
                this.Chart1.PrimaryYAxis.Range.Min = 0;
                this.Chart1.PrimaryYAxis.Range.Max = 120;
                this.Chart1.PrimaryYAxis.Range.Interval = 20;
    
                this.Chart1.Annotations[1].X = 1;
                this.Chart1.Annotations[1].Y = 57;
                this.Chart1.Annotations[2].X = 7;
                this.Chart1.Annotations[2].Y = 97;
            }
        }
      
    }
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Data;
    using System.ComponentModel;
    using System.Web.Script.Serialization;
      [Serializable]
        public class AnnotationChartData
        {
            public AnnotationChartData(string xval, double yvalue1)
            {
                this.Xvalue = xval;
                this.YValue1 = yvalue1;
            }
            public string Xvalue
            {
                get;
                set;
            }
            public double YValue1
            {
                get;
                set;
            }
           
    
    
        }