
$(function () {
$(document).ready(function () {
//function will be called on button click having id btnsave
$("#Btnsubmit").click(function () {
//$("[id*=Btnselect]").click(function () {
var obj = {};
obj.TagIndex1 = $.trim($("[id*=TagIndex1]").val());
obj.TagIndex2 = $.trim($("[id*=TagIndex2]").val());
var ctx = document.getElementById("Chart").getContext('2d');
$.ajax({
url: "dropdowncomparetrend.aspx/ChartData",
data: JSON.stringify(obj),
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var chartLabel = eval(response.d[0]); //Labels
var chartData = eval(response.d[1]); //Data
var chartData1 = eval(response.d[2]); //Data
var chartData2 = eval(response.d[3]); //Data
var chartData3 = eval(response.d[4]); //Data
//var chartData4 = eval(response.d[5]); //Data
var barData = {
labels: chartLabel,
datasets: [
{
label: 'line',
fillColor: "rgba(0,120,193, 0.8)",
strokeColor: "Blue",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "Green",
pointHighlightFill: "",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData
},
{
label: 'line',
fillColor: "rgba(225,225,225,0.5)",
strokeColor: "Red",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "blue",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,2)",
data: chartData1
},
{
label: 'line',
fillColor: "rgba(225,225,225,0.6)",
strokeColor: "green",
pointColor: "rgba(220,220,220,3)",
pointStrokeColor: "Red",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData2
}, {
label: 'line',
fillColor: "rgba(225,225,225,0.6)",
strokeColor: "green",
pointColor: "rgba(220,220,220,3)",
pointStrokeColor: "Red",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData2
}
]
};
var skillsChart = new Chart(ctx).Line(barData);
}
});
}
);
});
nitish raiPosted Jan 11, 2018, 5:12 AM