asp.net का उपयोग chart.js में डेटाबेस एकाधिक लाइन चार्ट से डेटा प्राप्त कर रहा है, सी # यहाँ कोड
<script type="text/javascript">
$(document).ready(function() {
debugger;
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "CampComparison.aspx/getLineChartDataload",
data:{},
async: true,
cache: false,
dataType: "json",
success: OnSuccess_,
error: OnErrorCall_
})
function OnSuccess_(reponse) {
var aData = reponse.d;
var aLabels = aData[0];
var aDatasets1 = aData[1];
var aDatasets2 = aData[2];
var aDatasets3 = aData[3];
var aDatasets4 = aData[4];
var aDatasets5 = aData[5];
var lineChartData = {
labels: aLabels,
datasets: [
{
label: "Data1",
//fill:false,
fillColor: "rgba(0,0,0,0)",
strokeColor: "rgba(220,220,220,1)",
pointColor: "rgba(200,122,20,1)",
data: aDatasets1
},
{
label: "Data2",
fillColor: 'rgba(0,0,0,0)',
strokeColor: 'rgba(220,180,0,1)',
pointColor: 'rgba(220,180,0,1)',
data: aDatasets2
},
{
label: "Data5",
fillColor: "rgba(0,0,0,0)",
strokeColor: "rgba(151,187,205,1)",
pointColor: "rgba(152,188,204,1)",
data: aDatasets3
},
{
label: "Data4",
fillColor: 'rgba(0,0,0,0)',
strokeColor: 'rgba(151,187,205,1)',
pointColor: 'rgba(151,187,205,1)',
data: aDatasets4
},
{
label: "Data4",
fillColor: 'rgba(0,0,0,0)',
strokeColor: 'rgba(151,187,205,1)',
pointColor: 'rgba(151,187,205,1)',
data: aDatasets5
},
]
}
Chart.defaults.global.animationSteps = 50;
Chart.defaults.global.tooltipYPadding = 16;
Chart.defaults.global.tooltipCornerRadius = 0;
Chart.defaults.global.tooltipTitleFontStyle = "normal";
Chart.defaults.global.tooltipFillColor = "rgba(0,160,0,0.8)";
Chart.defaults.global.animationEasing = "easeOutBounce";
Chart.defaults.global.responsive = true;
Chart.defaults.global.scaleLineColor = "black";
Chart.defaults.global.scaleFontSize = 16;
//lineChart.destroy();
//document.getElementById("canvas").innerHTML = ' ';
//document.getElementById("chartContainer").innerHTML = ' ';
//document.getElementById("chartContainer").innerHTML = '<canvas id="canvas" style="width: 650px; height: 350px;"></canvas>';
//var ctx = document.getElementById("canvas").getContext("2d");
//ctx.innerHTML = "";
//var pieChartContent = document.getElementById('pieChartContent');
//pieChartContent.innerHTML = ' ';
//$('#pieChartContent').append('<canvas id="canvas" width="650px" height="350px"><canvas>');
//ctx = $("#canvas").get(0).getContext("2d");
var ctx = document.getElementById("canvas").getContext("2d");
var lineChart = new Chart(ctx).Line(lineChartData, {
bezierCurve: true,
chartArea: { width: '62%' },
responsive: true,
pointDotRadius: 10,
scaleShowVerticalLines: false,
scaleGridLineColor: 'black'
});
}
function OnErrorCall_(repo) {
//alert(repo);
}
});
//});
</script>
C#code
--------
[WebMethod(EnableSession = true)]
public static List<object> getLineChartDataload()
{
List<object> iData = new List<object>();
List<string> labels = new List<string>();
string advertiserid = HttpContext.Current.Session["AccountID"].ToString();
if (!string.IsNullOrEmpty(advertiserid))
{
// string StartDate = DateTime.Now.AddDays(-180).ToString("yyyy-MM-dd");
string StartDate = DateTime.Now.AddDays(-60).ToString("yyyy-MM-dd");
string EndDate = DateTime.Now.ToString("yyyy-MM-dd");
string strcampaignid = string.Empty;
DataTable dt = new DataTable();
int i = 0;
chatBL objcampid = new chatBL();
string query = "select distinct top 3 Campaignid,CampaignName from campaign where advertiserid='" + advertiserid + "' order by CampaignName";
dt = objcampid.commonFuntionGetData2(query);
foreach (DataRow drow in dt.Rows)
{
strcampaignid += drow["Campaignid"].ToString() + ",";
}
if (!string.IsNullOrEmpty(strcampaignid))
{
strcampaignid = strcampaignid.Substring(0, strcampaignid.Length - 1);
}
string[] campaignid = strcampaignid.Split(',');
//First get distinct Month Name for select Year.
// string query1 = "select top 10 cast(createddatetime as date) as month_name from advertiser where CurrentBal>0 order by CurrentBal";
//query1 += " ";
// query1 += " order by month_number;";
foreach (string strcamp in campaignid)
{
if (i == 0)
{
chatBL objblabel = new chatBL();
// DataTable dtLabels = objblabel.Topupmonthly("5E8EF1E9-67BF-489C-84CB-AFF0BB0FE707", "2015-09-18", "2016-02-25", "months");
DataTable dtLabels = objblabel.Topupmonthly2(strcamp, StartDate, EndDate, "months");
foreach (DataRow drow in dtLabels.Rows)
{
labels.Add(drow["InsDateTime"].ToString().Substring(2, 7));
}
iData.Add(labels);
}
// string query_DataSet_1 = "select top 10 CurrentBal from advertiser where CurrentBal>0 order by CurrentBal";
//query_DataSet_1 += " (orders_quantity) as total_quantity from mobile_sales ";
//query_DataSet_1 += " where YEAR(orders_date)='" + year + "' and mobile_id='" + mobileId_one + "' ";
//query_DataSet_1 += " group by month(orders_date) ";
//query_DataSet_1 += " order by month_number ";
chatBL objbl = new chatBL();
DataTable dtDataItemsSets_1 = objbl.Topupmonthly2(strcamp, StartDate, EndDate, "months");
List<double> lst_dataItem_1 = new List<double>();
foreach (DataRow dr in dtDataItemsSets_1.Rows)
{
lst_dataItem_1.Add(Convert.ToDouble(dr["CPACOUNT"].ToString()));
}
iData.Add(lst_dataItem_1);
//string query_DataSet_2 = "select top 10 Totalspent from advertiser where CurrentBal>0 order by CurrentBal";
//query_DataSet_2 += " (orders_quantity) as total_quantity from mobile_sales ";
//query_DataSet_2 += " where YEAR(orders_date)='" + year + "' and mobile_id='" + mobileId_two + "' ";
//query_DataSet_2 += " group by month(orders_date) ";
//query_DataSet_2 += " order by month_number ";
//chatBL objbl1 = new chatBL();
//DataTable dtDataItemsSets_2 = objbl1.Topupmonthly("5E8EF1E9-67BF-489C-84CB-AFF0BB0FE707", "2015-09-18", "2016-02-25", "months");
//List<double> lst_dataItem_2 = new List<double>();
//foreach (DataRow dr in dtDataItemsSets_2.Rows)
//{
// lst_dataItem_2.Add(Convert.ToDouble(dr["CPACOUNT"].ToString()));
//}
//iData.Add(lst_dataItem_2);
i = i + 1;
}
}
return iData;
}
ठनक समझा है कि मेरे पास, मैं के लिए है जाओ और अक्षर के बारे में अच्छी तरह से पढ़ा है। यह सब काम करता है जैसा कि मैं चाहता था। मुझे लगता है कि एक होना चाहिए; 'डेटासेट = lineChartData.datasets [line]' –
के अंत में हाँ, वहां अर्धविराम होना चाहिए, लेकिन इसका वैकल्पिक होना चाहिए। बीटीडब्ल्यू आप http://speakingjs.com/ को देखना चाहेंगे यदि आप जावास्क्रिप्ट – potatopeelings
सीख रहे हैं, तो मैं माइक मैकग्राथ द्वारा जावास्क्रिप्ट पढ़ रहा हूं, लेकिन मुझे थोड़ी अधिक जानकारी की आवश्यकता है और मेरे पास ऑब्जेक्ट उन्मुख प्रोग्रामिंग के साथ ज्यादा पृष्ठभूमि नहीं है जावास्क्रिप्ट बोलना मुझे अगले कदम की तरह दिखता है। धन्यवाद फिर से –