后台页面:
List<Map<String, String>> list = saleService.getSaleAndBuyer(); StringBuffer dateArray = new StringBuffer(); StringBuffer saleArray = new StringBuffer(); StringBuffer buyerArray = new StringBuffer(); dateArray.append("["); saleArray.append("["); buyerArray.append("["); for (int i=0;i<list.size();i++) { dateArray.append(list.get(i).get("date")); //数据格式的转换 saleArray.append(String.valueOf(list.get(i).get("salePrice"))); buyerArray.append(String.valueOf(list.get(i).get("buyerCount"))); if (i < list.size()-1) { dateArray.append(","); saleArray.append(","); buyerArray.append(","); } } dateArray.append("]"); saleArray.append("]"); buyerArray.append("]"); request.setAttribute("dateArray", dateArray); request.setAttribute("saleArray", saleArray); request.setAttribute("buyerArray", buyerArray); logger.warn("登录成功"); return "/stock/success";
前台页面:
<script> **var** dateList = "**${**dateArray**}**".replace("\[", "").replace("\]", "").split(","); **var** salePrice = "**${**saleArray**}**".replace("\[", "").replace("\]", "").split(","); **var** buyerCount = "**${**buyerArray**}**".replace("\[", "").replace("\]", "").split(","); **for** (**var** i = 0; i < buyerCount.length; i++) { buyerCount\[i\] = parseInt(buyerCount\[i\]) } ; **for** (**var** i = 0; i < salePrice.length; i++) { salePrice\[i\] = parseFloat(salePrice\[i\]) } ; **var** chart = { zoomType: 'xy' }; **var** subtitle = { text: '数据来源:www.xiaoduoyijia.xyz' }; **var** title = { text: '销售数据图' }; **var** xAxis = { categories: dateList, crosshair: **true ** }; **var** yAxis = \[{ // 第一条Y轴 labels: { format: '{value}人', style: { color: Highcharts.getOptions().colors\[1\] } }, title: { text: '单日客户量', style: { color: Highcharts.getOptions().colors\[1\] } } }, { // 第二条Y轴 title: { text: '单日销售额', style: { color: Highcharts.getOptions().colors\[0\] } }, labels: { format: '¥{value}', style: { color: Highcharts.getOptions().colors\[0\] } }, opposite: **true ** }\]; **var** tooltip = { shared: **true ** }; **var** legend = { layout: 'vertical', align: 'right', x: 0, verticalAlign: 'top', y: 0, floating: **true**, backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF' }; **var** series = \[{ name: '单日销售额', type: 'column', yAxis: 1, data: salePrice, tooltip: { valueSuffix: '元' } }, { name: '单日客户量', data: buyerCount, tooltip: { valueSuffix: '人' } } \]; **var** json = {}; json.chart \= chart; json.title \= title; json.subtitle \= subtitle; json.xAxis \= xAxis; json.yAxis \= yAxis; json.tooltip \= tooltip; json.legend \= legend; json.series \= series; $('#container').highcharts(json); </script>1、BigDemical 与String之间的转换
2、前后台的取值之后是否是所需要的,不是所需再转换
附:highcharts使用文档地址:https://www.hcharts.cn/docs/basic-chart