chartDir

 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
app.directive("sfChart", function(D3, NVD3, ChartArtist) {
return {
restrict: 'E',
templateUrl: 'templates/sf-chart.html',
scope: {
data: "=",
field: "@",
display: "@"
},
link: function(scope, element, attrs) {
var d3 = D3.d3;
var nv = NVD3.nv;
console.log('attr', attrs)
// Set scope attributes used for display toggles
// and changing bar chart orders (redraw)
scope.type = attrs.type;
scope.field = attrs.field;
scope.bar_count = 30;
// Redraw bar chart when parent scope changed aggregate data's order
scope.$on('SORTING-CHANGED', function() {
ChartArtist.drawBarChart(scope, element, d3, nv);
});
// Watch the display value
scope.$watch('display', function() {
if (scope.type !== scope.display && scope.display !== "both") {
console.log('hide chart', scope.display, scope.type);
$(element).hide();
} else {
console.log('show chart', scope.display, scope.type);
$(element).show();
ChartArtist.drawBarChart(scope, element, d3, nv);
}
});
// Redraw bar chart if aggregate data changes
scope.$watch('data', function() {
ChartArtist.drawBarChart(scope, element, d3, nv);
});
// Redraw bar chart if field changes (i.e volume or contract)
scope.$watch('field', function(newVal, oldVal) {
console.log('field is', newVal, oldVal);
if(newVal !== oldVal) ChartArtist.drawBarChart(scope, element, d3, nv);
});
// Watch the bar count
// scope.$watch('bar_count', function(newVal, oldVal) {
// if(newVal !== oldVal) ChartArtist.drawBarChart(scope, element, d3, nv);
// });
}
};
});