我如何使用highchart在jsp中的spring mvc中绘制图形

Question

I want to paint a graphic in jsp unsando spring mvc and highchart, but I still can't do it, I wait for your answer thank you 我想在jsp unsando spring mvc和highchart中绘制图形，但是我仍然做不到，我等待您的回答，谢谢

my view, This is where I want to paint the graph but the graph is not shown, it shows nothing 我的观点，这是我想要绘制图形的地方，但是图形未显示，它什么也没显示

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <title>Chart</title> 
            <script src="resources/assets/js/highcharts.js"></script>
            <script src="resources/assets/js/highcharts-3d.js"></script>
<!--          <script src="resources/assets/js/jquery.js"></script> -->
            <script src="https://code.jquery.com/jquery-3.2.1.js"></script>

    </head>

    <body class="page-container-bg-solid">
        <div class="page-container">
            <div class="page-content-wrapper">
                <div class="page-head" style="background-color:#eff3f8;padding-top:40px">
                    <div class="container">
                        <div class="row" style="margin-bottom:30px">
                            <div class="col-md-6">
                                <h1>my Chart</h1>
                            </div> 
                        </div>
                        <div class="row" style="margin-bottom:30px">                         
                            <div class="col-md-6" style="margin-top:20px">
                                <div id="mychart" style="width:100%; height:400px;"></div>
                            </div> 
                        </div>                        
                    </div> 
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () { 
                Highcharts.setOptions({
                    global: {
                        useUTC: false
                    }
                });
                drawSalesByTypeChart();
                drawSalesByRegionChart();
            });


            function drawSalesByRegionChart() {
                var salesByRegionChart = Highcharts.chart('mychart', {
                    chart: {
                        type: 'pie',
                        margin: 40,
                        options3d: {
                            enabled: true,
                            alpha: 45,
                            beta: 0
                        }
                    },
                    title: {
                        text: 'Sales by Region'
                    },
                    plotOptions: { 
                        pie: {
                            allowPointSelect: true,
                            depth: 35
                        }
                    },
                    series: [{ 
                        name: 'Regions',
                        colorByPoint:true,
                        data: [{
                            name: 'Northeast',
                            y: [[${listGraph}]]
                        }                      
                        ]
                    }]
                });
            }
        </script>        
    </body>
</html>

my controller 我的控制器

@RequestMapping(value = "/graphReport")
    public String combo(QcReport qc, Model model) throws IOException {
        List<QcReport> listGraph = assayServ.listGraphAssay();
        model.addAttribute("listGraph", listGraph);
        return ("graphReport");
    }

Answer 1

When I am comparing your work below tutorial: 当我在下面的教程中比较您的工作时：

https://careydevelopment.us/2017/07/01/add-charts-spring-boot-app-highchart/ https://careydevelopment.us/2017/07/01/add-charts-spring-boot-app-highchart/

You are trying to draw a pie chart which needs integer value while you are passing a list ${listGraph}. 您试图在传递列表$ {listGraph}时绘制一个需要整数值的饼图。

                    series: [{ 
                        name: 'Regions',
                        colorByPoint:true,
                        data: [{
                            name: 'Northeast',
                            y: [[${listGraph}]]
                        }                      
                        ]

我如何使用highchart在jsp中的spring mvc中绘制图形

问题描述

1 个解决方案

解决方案1
0 已采纳 2019-09-12 18:56:13

我如何使用highchart在jsp中的spring mvc中绘制图形

问题描述

1 个解决方案

解决方案1 0 已采纳 2019-09-12 18:56:13

解决方案1
0 已采纳 2019-09-12 18:56:13