Question

我不知道如何绑定morris甜甜圈图表。我有一个叫做客户的课程：

public class Customer {

    private Long id;

    private String name;

    private String email;

    private Address address;  

 //+ constructors + getter and setters

和一个叫做地址的课程：

public class Address {

    private Long id;

    private String country;

    private String city;

    private String street;

    private String zip;

//+ constructors + getter and setters

我有一个Rest控制器，它返回DB中的所有客户：

1:  {
    id: 2
    name: "Sydney Garrett"
    email: "lacinia@nuncQuisqueornare.edu"
    address: {
             id: 38
             country: "Spain"
             city: "Madrid"
             street: "P.O. Box 318, 7554 Natoque Avenue"
             zip: "92394"
             }
    }
2:  {
    id: 3
    name: "Peter Phillips"
    email: "Nulla@sodales.org"
    address: {
             id: 78
             country: "Spain"
             city: "Vigo"
             street: "6967 Id, Av."
             zip: "11498"
   }
}

现在，我想将Morris Donut与城市名称和每个城市的客户数量绑定（例如：Madrid 20，Vigo 12，Barcelona 30）

我正在尝试在js代码中执行类似的操作：

$.getJSON('http://localhost:8080/spring/customers/all', function(data){

    Morris.Donut({
         element: 'morris-donut-chart',
         data: data
        })

但我不知道如何在js代码中准备数据（计算每个城市的客户）。有什么建议吗？

Answer 1

我刚刚实现了类似的东西。 Morris无法为您计算和分组原始数据，您需要在服务器端代码中执行此操作。我将这个类用于我的数据点，并将它们的列表返回给我的Morris甜甜圈图。

public class DonutGraphDataPoint
{
    public string label { get; set; }
    public int value { get; set; }
}

因此，您必须操纵数据，以便每个标签都是您的城市，每个值都是您的数量。

因此，一旦实现它，返回给Morris的JSON结果应如下所示：

[{"label":"Madrid","value":20}, 
{"label":"Vigo","value":12}, 
{"label":"Barcelona","value":30}]

绑定莫里斯甜甜圈图表

1 个答案: