Spring MVC: как отображать ключи и значения Hashmap в старших диаграммах

Question

Я хочу отображать данные из моей базы данных в верхние графики (бары).

Я пытался использовать HashMap для передачи значений из контроллера в JavaScript.

MyController.java:

@GetMapping("/Hist")
public String barGraph(Model model) {

    ApplicationContext context = 
            new ClassPathXmlApplicationContext("Spring-Module.xml");

    PTS_POINTS_HISTORY_DAO ptsHistDAO = (PTS_POINTS_HISTORY_DAO) context.getBean("PtsPointsHistoryDAO");

    model.addAttribute("surveyMap", ptsHistDAO.barGraph());

     //ptsHistDAO.barGraph() returns Map<String, Integer>


    return "Hist";
}

hist.jsp:

<div id="containerx" style="width:100%; height:400px;"></div>
<script>

Highcharts.chart('containerx', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Total Redeem'
    },
    xAxis: {


        categories: ['${surveyMap.keySet()}']
    },
    yAxis: {
        max: 10000,
        min:0,
        title: {
            text: 'Numbre of Loylaty Points Redeemed'
        }
    },
    tooltip: {
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
        shared: true
    },
    plotOptions: {
        column: {
            stacking: 'permillion'
        }},
    series: [{
        name: 'Fulfilled',
        data: [9667, 0, 5694, 2752, 200]
    }, {
        name: 'Cancelled',
        data: [500, 3000, 300, 2, 1]
    }, {
        name: 'Pending',
        data: [3, 500, 400, 2, 50]
    }]
});

</script>

Я ожидал, что каждый ключ будет представлен своим значением на гистограмме, но на самом деле все ключи представляют только первое значение на графике.

ожидается: x1: 20151514 y1: 9667 отменено, 500 заполнено, 3 ожидающих что я получаю: x1: [20151514,20151513,20151512 ..] y1: 9667 отменено, 500 заполнено, 3 ожидающих

Answer 1

Highcharts требует, чтобы свойство categories было массивом строк.Ваш результат был строкой, которая требовала использования JSON.parse метода:

var str = "[0013-05-08, 2010-11-17, 0015-05-09, 0024-01-01, 0021-01-01]"
var res = str.replace(/,\s/g, '","');
var res2 = res.replace('[', '["');
var res3 = res2.replace(']', '"]')

Highcharts.chart('container', {
    xAxis: {
        categories: JSON.parse(res3)
    },
    series: [{
        data: [1, 2, 3, 4, 5]
    }]
});

Демонстрационная версия: http://jsfiddle.net/BlackLabel/k4L3whu5/

Справочник по API: https://api.highcharts.com/highcharts/xAxis.categories