0
我試圖使用AJAX將標籤和數據加載到ChartJS中。ChartJS AJAX加載標籤和數據
使用
{
"trendingLineChartLabels": "['JAN','FEB','MAR']",
"trendingLineChartData": "[1, 5, 2]"
}
jQuery代碼
$.getJSON("test.json", function(response) {
console.log(JSON.stringify(response.trendingLineChartLabels));
var trendingLineChartData = {
labels : response.trendingLineChartLabels,
datasets : [
{
label: "First dataset",
fillColor : "rgba(128, 222, 234, 0.6)",
strokeColor : "#ffffff",
pointColor : "#00bcd4",
pointStrokeColor : "#ffffff",
pointHighlightFill : "#ffffff",
pointHighlightStroke : "#ffffff",
data: response.trendingLineChartData
}
]
}, trendingLineChart = document.getElementById("trending-line-chart").getContext("2d");
window.trendingLineChart = new Chart(trendingLineChart).Line(trendingLineChartData, {scaleShowGridLines:!0,scaleGridLineColor:"rgba(255,255,255,0.4)",scaleGridLineWidth:1,scaleShowHorizontalLines:!0,scaleShowVerticalLines:!1,bezierCurve:!0,bezierCurveTension:.4,pointDot:!0,pointDotRadius:5,pointDotStrokeWidth:2,pointHitDetectionRadius:20,datasetStroke:!0,datasetStrokeWidth:3,datasetFill:!0,animationSteps:15,animationEasing:"easeOutQuart",tooltipTitleFontFamily:"'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",scaleFontSize:12,scaleFontStyle:"normal",scaleFontColor:"#fff",tooltipEvents:["mousemove","touchstart","touchmove"],tooltipFillColor:"rgba(255,255,255,0.8)",tooltipTitleFontFamily:"'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",tooltipFontSize:12,tooltipFontColor:"#000",tooltipTitleFontFamily:"'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",tooltipTitleFontSize:14,tooltipTitleFontStyle:"bold",tooltipTitleFontColor:"#000",tooltipYPadding:8,tooltipXPadding:16,tooltipCaretSize:10,tooltipCornerRadius:6,tooltipXOffset:10,responsive:!0});
});
我尋找解決方案,但沒有找到任何。預先感謝您的幫助。
非常感謝幫助 –
@MichałBereszyński你是歡迎:) –
接受答案 –