fixed map resize

This commit is contained in:
Marian Oancea 2015-02-08 17:20:43 +02:00
parent dad7b8f2ba
commit 409e83d3ed
2 changed files with 40 additions and 42 deletions

View File

@ -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();
});
}
};
}]);

View File

@ -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){