Как избавиться от значений жесткого кодирования здесь?

Question

Я хочу заполнить данные в круговой диаграмме.Я передаю свои данные с помощью ArrayList.Для каждой записи я даю жестко закодированное значение.Если я использую цикл foreach, то только одни данные повторяются для других, это не сработает.Как это сделать?

Вот мой метод Controller

@RequestMapping("/pie")
public String pieChart(Model model)
{
    Map<Integer, Integer> map = getAgeKeyValue();
    Set<Map.Entry<Integer, Integer>> hmap = map.entrySet();
    ArrayList<Integer> key = new ArrayList<>();
    ArrayList<Integer> value = new ArrayList<>();
    for (Map.Entry<Integer, Integer> data : hmap)
    {
        key.add(data.getKey());
        value.add(data.getValue());
    }
    model.addAttribute("key", key);
    model.addAttribute("value", value);
    return "pieChart";
}

Вот мой pieChart.jsp

<script>
$(function()
{ 
    var pieChart = new CanvasJS.Chart("pieChartContainer", 
    {
        animationEnabled: true,
        theme: "light2",
        title:
        {
            text: "Age wise total number of Employees",
            fontSize: 20,
            fontFamily: "Trebuchet MS",
            fontWeight: "bold",
            margin: 10
        },
        data: 
        [{        
            type: "pie",
            dataPoints: 
            [   
                { y: ${value[0]},  label: "${key[0]}" },                 
                { y: ${value[1]},  label: "${key[1]}" },                        
                { y: ${value[2]},  label: "${key[2]}" },
                { y: ${value[3]},  label: "${key[3]}" },
                { y: ${value[4]},  label: "${key[4]}" },
                { y: ${value[5]},  label: "${key[5]}" },
                { y: ${value[6]},  label: "${key[6]}" },
                { y: ${value[7]},  label: "${key[7]}" }

            ]
        }]
    });
    pieChart.render();
});
</script>
<div class="card shadow p-3 bg-white rounded">
    <div class="card-body">
        <div id="pieChartContainer" style="height: 240px; width: 100%;"></div>
    </div>
</div>

Из другого jsp я вызываю pieChart.jsp, используя ajax

Вот оно

<div class="col-md-6 p-1">
    <div id="pieGraph"></div>
</div>

$.ajax
({
    url: "pie", 
    async: false, 
    success: function(data) 
    { 
        console.log(data); 
        $("#pieGraph").append(data);
    }
});