1
2
3
4
5
6
7
8
9
10
11
12
13
14
function setFilter() {
    var filters = [];
    var vals = dataProvider.getDistinctValues("year");
    $.each(vals, function (k, v) {
        var filter = {};
        filter.name = v;
        filter.criteria = "value = '" + v + "'";
        filters.push(filter);
    });
 
    var col = gridView.columnByName("Year");
    col.filters = filters;
    gridView.setColumn(col);
}

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
function gridEvents(grid, provider) {
    provider.onRowCountChanged = function () {
        setHiChart(dataProvider)
    }
 
    grid.onFilteringChanged = function (grid) {
    	setHiChart(provider);
        var count = grid.getItemCount();
        var jArr = [];
        for (var i = 0; i < count; i++) {
            var jObj = grid.getValues(i);
            if (!jObj.Year) jObj.Year = null;
            jArr.push(jObj);
        }
        var chart = $("#container").highcharts();
        if (!chart) return;
        $.each(chart.series, function (k, v) {
            if (this.name == "Year") {
                var cate = $.map(jArr, function () {
                    return this.Year;
                });
                chart.xAxis[0].setCategories(cate);
            } else {
                var data = [];
                $.map(jArr, function (val) {
                    data.push(val[v.name] ? val[v.name] : null);
                })
                this.setData(data);
            }
        });
    }
}

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
function setHiChart(provider) {
    //필터 결과에 맞는 categories 목록 생성
    var categories = [];
    for(var i = 0; i < gridView.getItemCount(); i++){
        categories.push(gridView.getValue(i, "Year"));
    }
	
    var diVal = provider.getFieldValues("DIncome");
    $.each(diVal, function (k, v) {
        if (v == undefined)
            diVal[k] = null;
    });
 	
    $('#container').highcharts({
        title: {
            text: '통계청 총생산소득',
            x: -20
            //center
        },
        subtitle: {
            text: 'www.realgrid.com',
            x: -20
        },
        xAxis: {
            categories: categories,
            crosshair: true
        },
        yAxis: [{
            title: {
                text: '소득 ($)'
            },
            labels: {
                format: '{value} $'
            }
        }],
        tooltip: {
            shared: true // 한 로우에 여러 컬럼의 값을 표시
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            type: 'spline',
            name: "GDP",
            data: provider.getFieldValues("GDP"),
            tooltip: {
                valueSuffix: "$ ($100 million)"
            }
        }, {
            type: 'spline',
            name: "GNI",
            data: provider.getFieldValues("GNI"),
            tooltip: {
                valueSuffix: "$ ($100 million)"
            }
        }, {
            type: 'spline',
            name: "PGNI",
            data: provider.getFieldValues("PGNI"),
            tooltip: {
                valueSuffix: "$"
            }
        }, {
            type: 'spline',
            name: "DIncome",
            data: diVal,
            tooltip: {
                valueSuffix: "$"
            }
        }],
        chart: {
            events: {
                load: function () {
 
                },
                click: function (e) {
                    console.log(e);
                }
            }
        }
    });
}