최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday

티스토리 뷰

■ 프론트엔드 ■/Amchart

export

serpiko 2018. 11. 27. 21:55


   export


Link)


https://www.amcharts.com/docs/v3/tutorials/exporting-charts-and-maps-to-images-or-pdf/

 

https://github.com/amcharts/export

 

https://www.amcharts.com/kbase/export-specific-dataset-to-xlsx-json-or-csv/



   code


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!-- amchart -->
<script type='text/javascript' src='/common/js/amcharts/amcharts.js'></script>
<script type='text/javascript' src='/common/js/amcharts/serial.js'></script>
<script type='text/javascript' src="/common/js/amcharts/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="/common/js/amcharts/plugins/export/export.css" type="text/css" media="all" />
 
 
 
 
 
///////////////////////////////////////////////////////////////////////////////////////////////
//
// 내보내기
// 2018.12.07.금요일 허정진
//
////////////////////////////////////////////////////////////////////////////////////////////////
"export": {
    "enabled"true,
//                    "menuReviver": function(item,li) {
//                      if (item.format == "XLSX") {
//                        item.name = "sheet";
//                      }
//                      return li;
//                    },
    // 값을 comma(,) 처리 하기위해서 데이터를 다 뒤져보자
    "processData"function(data, cfg){
        
        for(var i=0; i<data.length; i++){
            
            // 오브젝트검사 : 데이터 안에 속성이 존재하고 && 타입이 number 인것만 골라낸다
            // 주의!!. columnNames 로 인해서 속성이름이 UTF-8 로 바뀌었으니 속성접근자를 dot(.) 이아닌 [] 로 접근
            forvar property in data[i] ){
                iftrue == data[i].hasOwnProperty( property ) && "number" == typeof data[i][property] ){
 
                    // 존재하는 number를 => 소수점2자리로변환 => string으로 형변환 => 3자리마다 콤마(,)찍는다
                    data[i][property] = data[i][property].toLocaleString();
                    //data[i][property] = data[i][property].toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                    //data[i][property] = NumberToSize(data[i][property], "bps", 2); // bps Kbps, Mbps...
                    
                }
            }
        }
        return data;
    },
    "libs": {
      //"path": "https://www.amcharts.com/lib/3/plugins/export/libs/"
      //"path": "../common/js/amcharts/plugins/export/libs/",
    },
    "dateFormat""YYYY-MM-DD HH:NN:SS",
    // 컬럼 rename 맵핑
    "exportTitles"true,
    "columnNames": {
        "time""날짜",
        "total""데이터"
      },
    // TODO : 보여지는 필드를 직접지정 => 순서가 없는경우 time을 맨첫번째로, total을 맨 뒤로 옮겨야한다
//                    "exportFields": [
//                        "time",
//                        "total",
//                    ],
    // 파일이름 지정
    "fileName":"chartdata",
    "menu":[{
        "class":"export-main",
        "format":"XLSX",
        "dateFormat""YYYY-MM-DD HH:NN:SS",
        "withHeader" : true,
        "stringify:" : false,
        "menu":[{
            "label":"다운로드 데이터",
            "menu":["XLSX""CSV"]
            },{
            "label""다운로드 이미지",
            "menu":["PNG","JPG","SVG"]
            },{
            "label""그림그리기",
            "action":"draw",
            "menu": [ {
              "class""export-drawing",
              "menu": [ {
                "label""Edit",
                "menu": [ "UNDO""REDO""CANCEL" ]
              }, {
                "label""Save",
                "format""PNG"
              } ]
            } ]
        }]
    }]
},
// end. export
///////////////////////////////////////////////////////////////////////////////////////////////
 
 
 
 
//amchart 객체에 접근하여 속성 컨트롤
amchartPeriodClass.amchart.export.config.columnNames.total = "Total (bps)";
amchartPeriodClass.amchart.export.config.fileName = "TrafficDaily";
 
 
 
 
 
 
 
cs



   result)






'■ 프론트엔드 ■ > Amchart' 카테고리의 다른 글

startEffect  (0) 2018.11.14
댓글