zoukankan      html  css  js  c++  java
  • 关于amcharts 双排column的学习

    最近在项目中要用到amcharts,而且要求显示形式为双column,现举例如下:

    function getPurchaseChart(){
    $.get("income",{"areaId":"","flag":"4"},function(chartData){
    $("#purchaseChartDiv").html("");
    YSZE = 0;
    ZXZE = 0;
    ZXWCL = 0.0;
    $.each(chartData,function(i,data){
    $.each(data,function(key,value){
    if(key=="YSZE"){
    YSZE += value;
    }else if(key=="ZXZE"){
    ZXZE += value;
    }
    });
    });
    ZXWCL = ZXZE/YSZE;
    $("#cgzb").html(YSZE);
    $("#cgzx").html(ZXZE);
    $("#cgzxwcl").html(ZXWCL);
    $("#purchaseChartDiv").html("");
    // SERIAL CHART
    var chart = new AmCharts.AmSerialChart();
    chart.dataProvider = chartData;
    chart.categoryField = "QXMC";
    chart.startDuration = 1;
    chart.colors = [ "#4470A5"];

    // category
    var categoryAxis = chart.categoryAxis;
    categoryAxis.labelRotation = 0;
    categoryAxis.gridPosition = "start";
    // GRAPH,显示预算总额信息
    var graph = new AmCharts.AmGraph();
    graph.valueField = "YSZE";
    graph.balloonText = "[[category]]: [[value]]";
    graph.type = "column";
    graph.lineAlpha = 0;
    graph.fillAlphas = 0.8;
    graph.addListener("clickGraphItem", getTown2);
    chart.addGraph(graph);
    // GRAPH,显示执行总额信息
    var graph1 = new AmCharts.AmGraph();
    graph1.valueField = "ZXZE";
    graph1.balloonText = "[[category]]: [[value]]";
    graph1.type = "column";
    graph1.lineAlpha = 0;
    graph1.fillAlphas = 0.8;
    graph1.addListener("clickGraphItem", getTown3);
    chart.addGraph(graph1);
    // LEGEND,定义图例信息
    legend = new AmCharts.AmLegend();
    legend.align = "center";
    legend.position = "right";
    legend.markerType = "square";
    legend.valueWidth = 25;
    legend.valueText = "[[close]]";
    legend.labelText = "预算总额";
    chart.addLegend(legend);
    // legend1 = new AmCharts.AmLegend();
    // legend1.align = "center";
    // legend1.position = "right";
    // legend1.markerType = "square";
    // legend1.valueWidth = 25;
    // legend1.valueText = "[[open]]";
    // legend1.labelText = "执行总额";
    // chart.addLegend(legend1);

    chart.write("purchaseChartDiv");
    });
    }

    其实就是添加两个GRAPH。

  • 相关阅读:
    IP掩码的作用
    linux shell 笔记
    ubuntu apt-get Failed to fetch Temporary failure resolving 'security.ubuntu.com'
    ubuntu 16.04 & 18.04 远程桌面使用
    取消Ubuntu开机硬盘自检
    linux shell 脚本输入参数解析
    Ubuntu 16.04 + python3 源码 安装+使用labelImg最新版
    用tinyxml2读写xml文件_C++实现
    常用工具问题及解决方案
    可视化调试工具
  • 原文地址:https://www.cnblogs.com/zhli/p/3061195.html
Copyright © 2011-2022 走看看