1:By Google Api
<script type="text/javascript" src="//www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1', { packages: ['corechart'] });
</script>
<script type="text/javascript">
function drawVisualization(dataValues) {
var data = google.visualization.arrayToDataTable([
['drgrg', 'Pending', 'Rejected', 'Approved'],
['Scheme-2', 3, 5, 8],
['Scheme-1', 2, 3, 5]
]);
new google.visualization.BarChart(document.getElementById('visualization')).
draw(data,
{
title: "Application Status Chart",
width: 500, height: 350,
vAxis: { title: "Scholarship Scheme" },
hAxis: { title: "Number of Application" }
}
);
}
google.setOnLoadCallback(drawVisualization);
</script>
<div id="visualization" style="margin-left: 300px; margin-bottom: 50px;"></div>
2:By Dot net Control
<div id="ScholarChart">
<asp:Chart ID="Chart1" runat="server" BorderlineWidth="0" Width="500px" Visible="true" Palette="None" PaletteCustomColors="0, 192, 0; Blue; 192, 0, 0" ImageType="Jpeg">
<series>
<asp:Series Name="Series1" XValueMember="SchemeName" YValueMembers="ApprovedApplication"
LegendText="Approved Application" IsValueShownAsLabel="false" LabelToolTip="Approved" ChartArea="ChartArea1"
MarkerBorderColor="#DBDBDB">
<SmartLabelStyle MovingDirection="Left" IsMarkerOverlappingAllowed="true"/>
</asp:Series>
<asp:Series Name="Series2" XValueMember="SchemeName" YValueMembers="PendingApplication"
LegendText="Pending Application" IsValueShownAsLabel="false" LabelToolTip="Pending" IsVisibleInLegend="true" ChartArea="ChartArea1"
MarkerBorderColor="#DBDBDB">
</asp:Series>
<asp:Series Name="Series3" XValueMember="SchemeName" YValueMembers="RejectedApplication"
LegendText="Rejected Application" IsValueShownAsLabel="false" LabelToolTip="Reject" IsVisibleInLegend="true" ChartArea="ChartArea1"
MarkerBorderColor="#DBDBDB">
</asp:Series>
</series>
<legends>
<asp:Legend Title="Status" />
</legends>
<titles>
<asp:Title Docking="Bottom" Text="Scheme Name" />
<asp:Title Docking="Left" Text="No. Of Applicant" />
</titles>
<chartareas>
<asp:ChartArea Name="ChartArea1" >
</asp:ChartArea>
</chartareas>
</asp:Chart>
</div>
Code Behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Chart1.DataSource = gettable();
Chart1.DataBind();
}
}
public DataTable gettable() {
DataTable dt = new DataTable();
dt.Columns.Add("Schemename", typeof(string));
dt.Columns.Add("PendingApplication", typeof(int));
dt.Columns.Add("RejectedApplication", typeof(int));
dt.Columns.Add("ApprovedApplication", typeof(int));
dt.Rows.Add("Sheme-1", 4,5,8);
dt.Rows.Add("Sheme-2", 2,7,4);
return dt;
}
No comments:
Post a Comment