上一回，我们实现了从后台传递数据，在图表中展示，而图表的大部分配置都实在JS中控制的，

个人有个想法，我们应该可以将图表的配置都拿到后台去，没有在实际开发中使用过，不知道是否好用，这里简单尝试下

(PS:试了下，可行，但是不知道实际项目中可用否？)

1. 构造实体

我的想法是，在这里构造一个和Highcharts配置一样的一个实体：

为每一种属性配置一个java实体（这里需要注意的是实体的名称需与highchart中的属性一直，否则json解析出的数据就会有问题）

java代码

public class Title {    private String text;    public String getText() {        return text;    }    public void setText(String text) {        this.text = text;    }}

public class Chart {        private String type;    private String renderTo;    public String getType() {        return type;    }    public void setType(String type) {        this.type = type;    }    public String getRenderTo() {        return renderTo;    }    public void setRenderTo(String renderTo) {        this.renderTo = renderTo;    }            }

/** * @author lenovo *指定图标类型 */public class ChartType {    /**     * 柱状图     */    public final static String COLUMN="column";}

public class XAxis {    private String[] categories;    public String[] getCategories() {        return categories;    }    public void setCategories(String[] categories) {        this.categories = categories;    }    }

public class YAxis {    private Title title;    public Title getTitle() {        return title;    }    public void setTitle(Title title) {        this.title = title;    }        }

public class Serie {    private String name;    private Integer[] data;    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public Integer[] getData() {        return data;    }    public void setData(Integer[] data) {        this.data = data;    }    public Serie() {    }    public Serie(String name, Integer[] data) {        super();        this.name = name;        this.data = data;    }        }

import java.io.Serializable;import java.util.List;public class Highchart implements Serializable{    private static final long serialVersionUID = -5880168163194932425L;          private Chart chart;        private Title title;        private XAxis xAxis;        private YAxis yAxis;        private List
    
      series;        public Chart getChart() {          return chart;      }        public void setChart(Chart chart) {          this.chart = chart;      }        public Title getTitle() {          return title;      }        public void setTitle(Title title) {          this.title = title;      }        public XAxis getxAxis() {          return xAxis;      }        public void setxAxis(XAxis xAxis) {          this.xAxis = xAxis;      }        public YAxis getyAxis() {          return yAxis;      }        public void setyAxis(YAxis yAxis) {          this.yAxis = yAxis;      }        public List
     
       getSeries() {          return series;      }        public void setSeries(List
      
        series) {          this.series = series;      }                  }
      
     
    

后台的java代码

    @Override    protected void doPost(HttpServletRequest req, HttpServletResponse resp)            throws ServletException, IOException {        req.setCharacterEncoding("UTF-8");          resp.setContentType("text/html;charset=utf-8");                Chart chart = new Chart();        chart.setRenderTo("container");        chart.setType(ChartType.column);        Title title = new Title();        title.setText("我的第1个Highcarts图表！");        XAxis xAxis = new XAxis();        xAxis.setCategories(new String[] { "my", "first", "chart" });        YAxis yAxis = new YAxis();        Title yTitle = new Title();        yTitle.setText("Y轴标题");        yAxis.setTitle(yTitle);        Serie data_jane = new Serie("Jane", new Integer[] { 1, 0, 4 });        Serie data_john = new Serie("Jone", new Integer[] { 5, 7, 3 });        List
    
      series = new ArrayList
     
      ();        series.add(data_jane);        series.add(data_john);        Highchart highchart = new Highchart();        highchart.setChart(chart);        highchart.setTitle(title);        highchart.setxAxis(xAxis);        highchart.setyAxis(yAxis);        highchart.setSeries(series);        Gson gson = new Gson();                PrintWriter out = resp.getWriter();        out.print(gson.toJson(highchart));        out.flush();        out.close();    }
     
    

修改页面代码

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%>
    
     
     
      
       
            $(function() {        //从后台获取json格式的数据        $.getJSON("go" , function(data) {            //初始化chart            var chart = new Highcharts.Chart(data);        });    });    
            
        
       
      
     
    

效果：

这样的话有个好处，就是所有的信息都可以存到数据库中，做成可配置的，

可以做一个管理界面去修该，而不是去修改JS