欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

jquery+畫趨勢圖

錢衛國1年前8瀏覽0評論

jQuery是一種廣泛使用的JavaScript庫,可以簡化HTML文檔操作、事件處理、動畫、AJAX等常見任務,同時也可以和很多插件結合使用實現各種功能。其中,畫趨勢圖是jQuery的一個常用功能之一,可以通過jQuery和其他畫圖插件實現。

//引入jQuery和畫圖插件
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.min.js"></script>
//定義數據
var data = {
labels: ["2017年", "2018年", "2019年", "2020年", "2021年"],
datasets: [
{
label: "銷售量",
data: [100, 150, 200, 250, 300],
backgroundColor: "rgba(255, 99, 132, 0.2)",
borderColor: "rgba(255,99,132,1)",
borderWidth: 1
},
{
label: "利潤",
data: [50, 75, 100, 125, 150],
backgroundColor: "rgba(54, 162, 235, 0.2)",
borderColor: "rgba(54, 162, 235, 1)",
borderWidth: 1
}
]
};
//定義選項
var options = {
responsive: true,
title: {
display: true,
text: '銷售量與利潤趨勢圖'
},
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
};
//畫圖
var ctx = $("#myChart");
var myChart = new Chart(ctx, {
type: 'line',
data: data,
options: options
});

上述代碼使用了Chart.js插件,定義了兩個數據集:銷售量和利潤,并畫出了折線圖。同時,可以調整選項,如設置響應式、添加標題和坐標軸等。最后,將畫圖的結果賦值給canvas元素,并定義id為“myChart”,通過jQuery獲取元素并使用Chart.js繪制折線圖。