fixed map resize
This commit is contained in:
parent
dad7b8f2ba
commit
409e83d3ed
@ -16,33 +16,45 @@ angular.module('netStatsApp.directives', []).
|
||||
data: '='
|
||||
},
|
||||
link: function(scope, element, attrs) {
|
||||
element.empty();
|
||||
scope.init = function() {
|
||||
element.empty();
|
||||
|
||||
scope.map = new Datamap({
|
||||
element: element[0],
|
||||
scope: 'world',
|
||||
responsive: true,
|
||||
fills: {
|
||||
success: '#7bcc3a',
|
||||
info: '#10a0de',
|
||||
warning: '#FFD162',
|
||||
danger: '#F74B4B',
|
||||
defaultFill: '#282828'
|
||||
},
|
||||
geographyConfig: {
|
||||
borderWidth: 0,
|
||||
borderColor: '#000',
|
||||
highlightOnHover: false,
|
||||
popupOnHover: false
|
||||
},
|
||||
bubblesConfig: {
|
||||
scope.map = new Datamap({
|
||||
element: element[0],
|
||||
scope: 'world',
|
||||
responsive: true,
|
||||
fills: {
|
||||
success: '#7bcc3a',
|
||||
info: '#10a0de',
|
||||
warning: '#FFD162',
|
||||
danger: '#F74B4B',
|
||||
defaultFill: '#282828'
|
||||
},
|
||||
geographyConfig: {
|
||||
borderWidth: 0,
|
||||
borderColor: '#000',
|
||||
highlightOnHover: false,
|
||||
popupOnHover: false
|
||||
},
|
||||
bubblesConfig: {
|
||||
borderWidth: 0,
|
||||
popupOnHover: false,
|
||||
highlightOnHover: false
|
||||
}
|
||||
});
|
||||
|
||||
scope.map.bubbles(scope.data, {
|
||||
borderWidth: 0,
|
||||
popupOnHover: false,
|
||||
highlightOnHover: false
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
scope.map.bubbles(scope.data);
|
||||
scope.init();
|
||||
|
||||
window.onresize = function() {
|
||||
scope.$apply();
|
||||
};
|
||||
|
||||
scope.$watch('data', function() {
|
||||
scope.map.bubbles(scope.data, {
|
||||
@ -51,6 +63,12 @@ angular.module('netStatsApp.directives', []).
|
||||
highlightOnHover: false
|
||||
});
|
||||
}, true);
|
||||
|
||||
scope.$watch(function() {
|
||||
return angular.element(window)[0].innerWidth;
|
||||
}, function() {
|
||||
scope.init();
|
||||
});
|
||||
}
|
||||
};
|
||||
}]);
|
@ -1,24 +1,4 @@
|
||||
(function() {
|
||||
var mapHolder = document.getElementById('mapHolder');
|
||||
mapHolder.clientHeight = mapHolder.clientWidth/2;
|
||||
|
||||
Datamap.prototype.resize = function () {
|
||||
var self = this;
|
||||
var options = self.options;
|
||||
if (options.responsive) {
|
||||
var prefix = '-webkit-transform' in document.body.style ? '-webkit-' : '-moz-transform' in document.body.style ? '-moz-' : '-ms-transform' in document.body.style ? '-ms-' : '',
|
||||
newsize = options.element.clientWidth,
|
||||
oldsize = d3.select(options.element).select('svg').attr('data-width');
|
||||
d3.select(options.element).select('svg').selectAll('g').style(prefix + 'transform', 'scale(' + (newsize / oldsize) + ')');
|
||||
}
|
||||
}
|
||||
|
||||
d3.select(mapHolder).select('svg').attr('data-width', mapHolder.clientWidth);
|
||||
|
||||
// window.addEventListener("resize", function (event) {
|
||||
// map.resize();
|
||||
// });
|
||||
|
||||
var socket = io.connect();
|
||||
|
||||
socket.on('init', function(data){
|
||||
|
Loading…
Reference in New Issue
Block a user