zoukankan      html  css  js  c++  java
  • amchart 图表设置

    动画

    "sequencedAnimation": false, //设置图表没有动画
    startDuration: 0, //设置饼图没有动画

    valueAxes(Y轴):

    • gridAlpha: 0    //网格透明度

    categoryAxis(X轴):

    • fillAlpha:0.05    //折线图 图形后边的 背景,默认是透明颜色,不会出现看似柱状图的背景
    • gridCount:10     //标签个数
    • autoGridCount: false, //是否允许自动设置X轴标签
    • 设置X轴的标签样式:

      labelFunction: function (value, valueText, valueAxis) {
          if (value) {
              return $filter('date')(new Date(value), 'MMM yyyy');
          }
      }

       

    graphs(图形):[{}]

    • "bullet": "none" "round",
    • "bulletSize": 5 //折线图是否有折点,显示多大
    • "animationPlayed": true //出现柱状图/折线图时没有动画

    饼图标签显示

    "labelsEnabled": false   //饼图上不显示标签:

    设置饼图显示标签样式:

    "labelFunction": function (value, valueText, valueAxis) {
    return parseFloat(value.percents).toFixed(1) + '%'
    }

    图表图例

    "legend": {
    "enabled": true,
    "color": "#fff",
    "useGraphSettings": true,
    "position": "top",
    "fontSize": fontSize, // 图例字体大小
    "align": "right",
    markerSize: markerSize // 图例图标大小
    }

    当数据需定时刷新时,只是刷新数据而不是刷新图表:

    首先简单创建一个图表:
    var loadComplainChart = AmCharts.makeChart("chartcomplaindiv", {
        "theme": "dark",
        "type": "serial",
        "colors": [
            "#00FCFC"
        ],
    	"dataProvider": dailyUserComplain,
    }
    
    
    当数据在刷新变化时,只需要改变data就可以了:
    loadComplainChart.dataProvider = dailyUserComplain;
    loadComplainChart.validateData();
    
    当设置只刷新数据时,会发现之前设置的X轴标签样式会失效,这时我们需要重新定义X轴标签的个数以及是否需要自动显示X轴标签:
    loadComplainChart.categoryAxis.autoGridCount = false;
    loadComplainChart.categoryAxis.gridCount = dailyUserComplain.length;
  • 相关阅读:
    237. 删除链表中的节点
    牛客网-第一场-J-Fraction Comparision
    1. 两数之和
    CCF-201903-1大中小
    学习Python
    Convert Sorted Array to Binary Search Tree
    3-1
    Merge Sorted Array
    Climbing Stairs
    Add Binary
  • 原文地址:https://www.cnblogs.com/maoyazhi/p/6474914.html
Copyright © 2011-2022 走看看