jsp显示柱状图

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>柱状图示例</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <canvas id="myChart" width="400" height="400"></canvas>
    <script>
        var ctx = document.getElementById('myChart').getContext('2d');
        var myChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ${chartLabels}, // 从服务器获取的标签
                datasets: [{
                    label: '# of Votes',
                    data: ${chartData}, // 从服务器获取的数据
                    backgroundColor: [
                        'rgba(255, 99, 132, 0.2)',
                        'rgba(54, 162, 235, 0.2)',
                        'rgba(255, 206, 86, 0.2)',
                        'rgba(75, 192, 192, 0.2)',
                        'rgba(153, 102, 255, 0.2)',
                        'rgba(255, 159, 64, 0.2)'
                    ],
                    borderColor: [
                        'rgba(255, 99, 132, 1)',
                        'rgba(54, 162, 235, 1)',
                        'rgba(255, 206, 86, 1)',
                        'rgba(75, 192, 192, 1)',
                        'rgba(153, 102, 255, 1)',
                        'rgba(255, 159, 64, 1)'
                    ],
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    </script>
</body>
</html>

// 假设这是一个Servlet的doGet方法
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // 准备数据
    List<String> labels = Arrays.asList("Red", "Blue", "Yellow", "Green", "Purple", "Orange");
    List<Integer> data = Arrays.asList(12, 19, 3, 5, 2, 3);

    // 将数据转换为JSON格式
    String chartLabels = new Gson().toJson(labels);
    String chartData = new Gson().toJson(data);

    // 设置请求属性
    request.setAttribute("chartLabels", chartLabels);
    request.setAttribute("chartData", chartData);

    // 转发到JSP页面
    request.getRequestDispatcher("/index.jsp").forward(request, response);
}