フロントエンドchartsグラフのパッケージ使用について

1755 ワード

0 x 01 chartsについて
このグラフは初期に多く使われていましたが、デフォルトではほとんどの比較土がhighchartsを使っています.私にとって、私はやはり美しいことを気にして、so、chartsでいくつかのグラフを作る必要があります~コードを避けて後で読むのが骨が折れるため、やはりそれをカプセル化したほうがいいです.少なくとも後で他の人が引き継いでもいいです.
0x02 coding
/*
 *
 * Copyright (c) 2016
 * Author: Smarttang
 * Github: https://github.com/smarttang/
 * ======
 *           
 */

var mycharts;

(function(){
    
    "use strict";

    mycharts = {
        draw: function(countType,ElementId,Data)
        {
            //     
            var _node = document.getElementById(ElementId);
            //       
            if (_node){
                var _count = document.getElementById(ElementId).getContext("2d");
                //   
                var _conf = {
                    scaleOverlay : false,
                    scaleOverride : false,
                    responsive: true,
                    legend: {
                        position: 'top',
                    },
                    title: {
                        display: false
                    },
                    animation: {
                        animateScale: true,
                        animateRotate: true
                    }
                };
                //     
                var _chartObj = new Chart(_count);

                //   
                if (countType == 'Doughnut'){
                    window.myDoughnut = _chartObj.Doughnut(Data,_conf);
                }else if (countType == 'Line'){
                    window.myLine = _chartObj.Line(Data,_conf);
                }else if (countType == 'Pie'){
                    window.myPie = _chartObj.Pie(Data,_conf);
                }
            }
        }
    }
})(jQuery);