Search code examples
javascriptjspspring-mvchighchartsgraph-visualization

How to change code in "Pie Chart" in HighCharts


I Used to Spring MVC. This is my Java Service

    @Override
public ArrayList<SampleVO1> getAvgPetalBySpecies3() {
    ArrayList<SampleVO1> irisList = new ArrayList<SampleVO1>();
    try {
        REXP result = rEngine.eval("(ming <- tapply(iris$Petal.Length, iris$Species, mean))");
        REXP result1 = rEngine.eval("names(ming)");

        SampleVO1 sample1 = new SampleVO1();
        sample1.setName(result1.asStringArray());
        sample1.setY(result.asDoubleArray());
        irisList.add(sample1);

    } catch (Exception e) {
        logger.error(e.getMessage());
        throw new RuntimeException(e);
    }
    return irisList;
}

Oh! This is my VO

    private String[] name;
    private double[] y;

And This is my Controller

    @RequestMapping("/analytics/iris3")
public String getAvgPetalbySpecies3(Model model) {
    ArrayList<SampleVO1> irisList = analyticsService.getAvgPetalBySpecies3();
    Gson gson = new Gson();
    String irisData = gson.toJson(irisList);
    model.addAttribute("irisData2", irisData);

    return "analytics/visual";
}

At Last, This my JSP

<script type="text/javascript">
$(function() {
Highcharts.chart('pie', {
    chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false,
        type: 'pie'
    },
    title: {
        text: ''
    },
    tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
    },
    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: true
            },
            showInLegend: true
        }
    },

    series: 
           <%= request.getAttribute("irisData2") %>,

});
});
</script>

enter image description here

lol I saw White space... and I checked my sourceCode!

    series: 
           [{"name":["setosa","versicolor","virginica"],"y":[1.462,4.26,5.552]}],

I thought I receive not bad to iris data! but my highCharts didn't like that... How I fixed My code...?


Solution

  • You currently have the following code to add values to your data.

    SampleVO1 sample1 = new SampleVO1();
    sample1.setName(result1.asStringArray());
    sample1.setY(result.asDoubleArray());
    irisList.add(sample1);
    

    Where you set name = [] of strings, and Y = []´ of Doubles.

    This gives you [[name, name, name],[y,y,y]]

    Instead you should either join or loop through the number of elements in your lists as follows:

    for(int i = 1; i < result.length(); i = i + 1) {
        SampleVO1 sample1 = new SampleVO1();
        sample1.setName(result1[i].asStringArray());
        sample1.setY(result[i].asDoubleArray());
        irisList.add(sample1);
    }
    

    Which will give you a list like [[name, y], [name, y], [name, y]]. I am sure there is much better ways to add two arrays together in java though.

    Regardless, in the end you should en up with a JSON formatted list such as:

    [{name: 'setosa', y: 1.462}, {name: 'versicolor', y: 4.26}]