Ejemplo n.º 1
0
  @Test
  public void test() {
    // 地址:http://echarts.baidu.com/doc/example/pie7.html
    EnhancedOption option = new EnhancedOption();
    // 时间轴
    option
        .timeline()
        .data(
            "2013-01-01",
            "2013-02-01",
            "2013-03-01",
            "2013-04-01",
            "2013-05-01",
            new LineData("2013-06-01", "emptyStart6", 8),
            "2013-07-01",
            "2013-08-01",
            "2013-09-01",
            "2013-10-01",
            "2013-11-01",
            new LineData("2013-12-01", "star6", 8));
    option.timeline().autoPlay(true).label().formatter("function(s){return s.slice(0,7);}");
    // timeline变态的地方在于多个Option
    Option basic = new Option();
    basic.title().text("浏览器占比变化").subtext("纯属虚构");
    basic.tooltip().trigger(Trigger.item).formatter("{a} <br/>{b} : {c} ({d}%)");
    basic.legend().data("Chrome", "Firefox", "Safari", "IE9+", "IE8-");
    basic
        .toolbox()
        .show(true)
        .feature(
            Tool.mark,
            Tool.dataView,
            Tool.restore,
            Tool.saveAsImage,
            new MagicType(Magic.pie, Magic.funnel)
                .option(
                    new MagicType.Option()
                        .funnel(new Funnel().x("25%").width("50%").funnelAlign(X.left).max(1548))));

    int idx = 1;
    basic.series(getPie(idx++).center("50%", "45%").radius("50%"));
    // 加入
    option.options(basic);
    // 构造11个数据
    Option[] os = new Option[11];
    for (int i = 0; i < os.length; i++) {
      os[i] = new Option().series(getPie(idx++));
    }
    option.options(os);
    option.exportToHtml("pie7.html");
    option.view();
  }
Ejemplo n.º 2
0
  @Test
  public void test() {
    // 例子:http://echarts.baidu.com/doc/example/line.html
    EnhancedOption option = new EnhancedOption();
    option.tooltip().trigger(Trigger.axis);
    option.legend("邮件营销", "联盟广告", "直接访问", "搜索引擎");
    option.toolbox().show(true);
    option.calculable(true);
    option.xAxis(
        new CategoryAxis().boundaryGap(false).data("周一", "周二", "周三", "周四", "周五", "周六", "周日"));
    option.yAxis(new ValueAxis());
    option.series(
        new Line()
            .smooth(true)
            .name("邮件营销")
            .stack("总量")
            .symbol(Symbol.none)
            .data(120, 132, 301, 134, new LineData(90, Symbol.droplet, 5), 230, 210));

    // 实现不了js的这个效果
    // line.itemStyle.normal.areaStyle = new AreaStyle();
    LineData lineData = new LineData(201, Symbol.star, 15);
    lineData
        .itemStyle()
        .normal()
        .label()
        .show(true)
        .textStyle()
        .fontSize(20)
        .fontFamily("微软雅黑")
        .fontWeight("bold");
    option.series(
        new Line()
            .smooth(true)
            .name("联盟广告")
            .stack("总量")
            .symbol("image://http://echarts.baidu.com/doc/asset/ico/favicon.png")
            .symbolSize(8)
            .data(
                120,
                82,
                lineData,
                new LineData(134, Symbol.none),
                190,
                new LineData(230, Symbol.emptypin, 8),
                110));

    /* line = new Line();
    line.name = "邮件营销";
    line.stack = "总量";
    line.symbol = Symbol.none;
    line.smooth = true;
    //实现不了js的这个效果
    //line.itemStyle.normal.areaStyle = new AreaStyle();
    line.addData(120, 132, 301, 134,new LineData(90,Symbol.droplet,5),230,210);
    option.series.add(line);

    line = new Line();
    line.name = "邮件营销";
    line.stack = "总量";
    line.symbol = Symbol.none;
    line.smooth = true;
    //实现不了js的这个效果
    //line.itemStyle.normal.areaStyle = new AreaStyle();
    line.addData(120, 132, 301, 134,new LineData(90,Symbol.droplet,5),230,210);
    option.series.add(line);*/

    option.exportToHtml("line.html");
    option.view();
  }
Ejemplo n.º 3
0
  @Test
  public void test() {
    // 地址:http://echarts.baidu.com/doc/example/bar1.html
    EnhancedOption option = new EnhancedOption();
    option.title().text("某地区蒸发量和降水量").subtext("纯属虚构");
    option.tooltip().trigger(Trigger.axis);
    option.legend("蒸发量", "降水量");
    option
        .toolbox()
        .show(true)
        .feature(
            Tool.mark,
            Tool.dataView,
            new MagicType(Magic.line, Magic.bar).show(true),
            Tool.restore,
            Tool.saveAsImage);
    option.calculable(true);
    option.xAxis(
        new CategoryAxis()
            .data("1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"));
    option.yAxis(new ValueAxis());

    Bar bar = new Bar("蒸发量");
    bar.data(2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3);
    bar.markPoint()
        .data(
            new PointData().type(MarkType.max).name("最大值"),
            new PointData().type(MarkType.min).name("最小值"));
    bar.markLine().data(new PointData().type(MarkType.average).name("平均值"));

    Bar bar2 = new Bar("降水量");
    List<Double> list =
        Arrays.asList(2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3);
    bar2.setData(list);
    bar2.markPoint()
        .data(
            new PointData("年最高", 182.2).xAxis(7).yAxis(183).symbolSize(18),
            new PointData("年最低", 2.3).xAxis(11).yAxis(3));
    bar2.markLine().data(new PointData().type(MarkType.average).name("平均值"));

    option.series(bar, bar2);
    option.exportToHtml("bar1.html");
    option.view();
  }