zoukankan      html  css  js  c++  java
  • amcharts使用心得

    在使用amcharts做统计的时候,遇到一个问题,就是怎么把后台传过来的一个json格式的字符串怎么转换成json数组,因为amchatrs要求解析的数据格式是json格式的数组。

    解决方案:在js中先将隐藏域中的值转换成Array数组,再赋给chart的dataProvider属性,具体过程如下:

    1、action中需要一个变量存储json格式的字符串传到jsp页面。

    private String countAllStr = "";

    public String getCountAllStr() {   

      return countAllStr;  

    }

    public void setCountAllStr(String countAllStr) {   

      this.countAllStr = countAllStr;

    }

    2、jsp页面处理:

    <input id="countAllStr" type="hidden" value="<s:property value='countAllStr'/>"/>

    <script type="text/javascript">  

      var dataForCountAll = new Array();
        dataForCountAll = eval($("#countAllStr").val());

      // SERIAL CHART
         var chartForCountAll = new AmCharts.AmSerialChart();
         chartForCountAll.dataProvider = dataForCountAll;
         chartForCountAll.categoryField = "title";
         chartForCountAll.marginRight = 0;
         chartForCountAll.marginTop = 0;   
         chartForCountAll.autoMarginOffset = 0;
         chartForCountAll.columnWith = 5;
       // the following two lines makes chart 3D
         chartForCountAll.depth3D = 20;
         chartForCountAll.angle = 30;
         //columnWidth
         chartForCountAll.columnWidth = 0.2;
         //columnSpacing
         chartForCountAll.columnSpacing = 2;
         //colors
         //chartForCountAll.colors = ['#FF6600', '#FCD202', '#B0DE09', '#0D8ECF', '#2A0CD0', '#CD0D74', '#CC0000', '#00CC00', '#0000CC', '#DDDDDD', '#999999', '#333333', '#990000'];
         // category
         var categoryAxis = chartForCountAll.categoryAxis;
         categoryAxis.labelRotation = 0;
         categoryAxis.dashLength = 5;
         categoryAxis.gridPosition = "start";
         // value
         var valueAxis = new AmCharts.ValueAxis();
         valueAxis.dashLength = 5;
         chartForCountAll.addValueAxis(valueAxis);
         // GRAPH           
         var graph = new AmCharts.AmGraph();
         graph.valueField = "value";
         graph.balloonText = "[[title]]: [[value]]";
         graph.type = "column";
         graph.lineAlpha = 0;
         graph.fillAlphas = 1;
         graph.lineColor = ['#FF6600', '#FCD202'];
         chartForCountAll.addGraph(graph);
         // WRITE
         chartForCountAll.write("countAllList");

    </script>

  • 相关阅读:
    RHEL因为selinux设置失误,无法重启问题。(centos适用)
    Linux系统忘记管理员密码(CentOS、RHEL、Ubuntu)
    cobbler PXE 安装系统时出现的问题
    虚拟机ping 不通主机,主机可ping 虚拟机解决方法
    CentOS7系统更改网卡名为eth0
    PXE-cobbler 无人值守装机------续
    PXE-cobbler 无人值守装机
    DELL PowerEdge R410系统日志满报错
    matlab添加toolbox失败的解决办法
    vs2017+opencv3.4.0的配置方法
  • 原文地址:https://www.cnblogs.com/zhli/p/2812793.html
Copyright © 2011-2022 走看看