我是 javascript 新手，必須使用我在 jsp 檔案中的 Chart.js 庫，下面是按鈕的指令
window.open("test.jsp", "width=" 800 "height=" 580);
在 test.jsp 檔案中，此代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>test</title>
<script type=“text/javascript”>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.5.1/Chart.min.js"></script>
<script type=“test.jsp”>
<script type=“text/javascript”>
var ctx = document.getElementById('myChart');
var stars = [135850, 52122, 148825, 16939, 9763];
var frameworks = ['React', 'Angular', 'Vue', 'Hyperapp', 'Omi'];
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: frameworks,
datasets: [{
label: 'Github Stars',
data: stars
}]
},
})
</head>
<body>
<canvas id="myChart" width="800" height="400"></canvas>
</body>
</html>
我可以打開新視窗，但看不到里面的任何東西。我想所有的代碼都在jsp檔案中運行，而不是委托給js和html檔案之外。
uj5u.com熱心網友回復：
您的代碼中存在不同的問題。
- 參考的 Chart.js 庫不存在。而不是
...Chart.min.js，寫...chart.min.js（小寫）。 - 在 a 中定義您的自定義 JS 代碼
function并僅在body其canvas完全加載 (<body onl oad="drawChart()">) 后執行它。
請看下面的可運行HTML代碼，它應該與JSP.
<!DOCTYPE html>
<html lang="en">
<head>
<title>test</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.5.1/chart.min.js"></script>
<script type="text/javascript">
function drawChart() {
var stars = [135850, 52122, 148825, 16939, 9763];
var frameworks = ['React', 'Angular', 'Vue', 'Hyperapp', 'Omi'];
new Chart('myChart', {
type: 'bar',
data: {
labels: frameworks,
datasets: [{
label: 'Github Stars',
data: stars
}]
},
});
}
</script>
</head>
<body onload="drawChart()">
<canvas id="myChart" width="800" height="400"></canvas>
</body>
</html>轉載請註明出處，本文鏈接：https://www.uj5u.com/net/318168.html
標籤：javascript jsp 图表.js