Improving D3 component event handling, responsiveness

This commit is contained in:
Colin McLeod
2015-06-07 15:42:59 -07:00
parent e876732ce0
commit b5e1c86a93
3 changed files with 42 additions and 27 deletions

View File

@@ -8,7 +8,7 @@ angular.module('app').directive('slider', ['$window', function ($window) {
change: '&onChange'
},
link: function(scope, element) {
var margin = {top: -10, right: 130, bottom: 0, left: 50},
var margin = {top: -10, right: 140, bottom: 0, left: 50},
height = 40, // Height is fixed
h = height - margin.top - margin.bottom,
fmt = d3.format('.2f'),
@@ -22,7 +22,7 @@ angular.module('app').directive('slider', ['$window', function ($window) {
slider = vis.append("g").attr("class", "slider"),
filled = slider.append('path').attr('class', 'filled').attr("transform", "translate(0," + h/2 + ")"),
brush = d3.svg.brush().x(x).extent([scope.max, scope.max]).on("brush", brushed),
handle = slider.append("circle").attr("class", "handle").attr("r", '0.75em'),
handle = slider.append("circle").attr("class", "handle").attr("r", '0.6em'),
lbl = slider.append("g").append("text").attr("y", h/2);
slider.call(brush);
@@ -70,6 +70,11 @@ angular.module('app').directive('slider', ['$window', function ($window) {
handle.attr("cx", x(val));
filled.attr("d", "M0,0V0H" + x(val) + "V0");
}
scope.$on('$destroy', function() {
angular.element($window).unbind('orientationchange resize render', render);
});
}
};
}]);