Tech
Forums
Jobs
Books
Events
Videos
Live
More
Interviews
Certification
Training
Career
Members
News
Blogs
Contribute
An Article
A Blog
A Video
An Ebook
An Interview Question
Register
Login
3
Answers
Chart using jquery Chart.js
Shiv Kumar Yadav
6y
189
1
Reply
Hi,
I am using chart.js for creating chart in asp.net whit the help of ajax method i am got value through ajax.
i have tried everything but it can not create chart can any one help me
this my code in jquery
$(document).ready(
function
() {
var
lbl = [];
var
dat = [];
$.ajax({
url:
"../Home/getData"
,
type:
"Post"
,
dataType:
"json"
,
success:
function
(data) {
$.each(data,
function
(key, value) {
lbl.push(value.Item);
dat.push(value.Price);
//alert("Item" + lbl + " Price" + dat);
})
var
myJSON = JSON.stringify(lbl);
var
xyz = [lbl];
var
dat1 = [dat];
var
ctx = document.getElementById(
"lineChart1"
);
var
lineChart =
new
Chart(ctx, {
type:
'line'
,
data: {
labels: xyz,
//["January", "February", "March", "April", "May", "June", "July"],
//$.parseJSON(lbl),
datasets: [{
label:
"My First dataset"
,
backgroundColor:
"rgba(38, 185, 154, 0.31)"
,
borderColor:
"rgba(38, 185, 154, 0.7)"
,
pointBorderColor:
"rgba(38, 185, 154, 0.7)"
,
pointBackgroundColor:
"rgba(38, 185, 154, 0.7)"
,
pointHoverBackgroundColor:
"#fff"
,
pointHoverBorderColor:
"rgba(220,220,220,1)"
,
pointBorderWidth: 1,
data: [dat1]
}, {
label:
"My Second dataset"
,
backgroundColor:
"rgba(3, 88, 106, 0.3)"
,
borderColor:
"rgba(3, 88, 106, 0.70)"
,
pointBorderColor:
"rgba(3, 88, 106, 0.70)"
,
pointBackgroundColor:
"rgba(3, 88, 106, 0.70)"
,
pointHoverBackgroundColor:
"#fff"
,
pointHoverBorderColor:
"rgba(151,187,205,1)"
,
pointBorderWidth: 1,
data: [dat1]
}]
},
});
}
});
});
Post
Reset
Cancel
Answers (
3
)
Next Recommended Forum
How to hide and show div using jquery?
How do update text field with selected text from dropdown