mirror/librenms-librenms
1
0
Fork 0
mirror of https://github.com/librenms/librenms.git synced 2024-10-07 16:52:45 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

EventObject transmitted to handlers & improvements for scaling plots in the legend

Browse Source
This commit is contained in:
Vincent Broute
2013-09-24 13:08:38 +02:00
parent 09e413f34f
commit e31ba7557d
2 changed files with 23 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
examples.js
View File

@ -74,7 +74,7 @@ $(function(){
animDuration:0 animDuration:0
}, },
eventHandlers : { eventHandlers : {
click: function(id, mapElem, textElem) { click: function(e, id, mapElem, textElem) {
var newData = {'areas' : {}}; var newData = {'areas' : {}};
if (mapElem.originalAttrs.fill == "#5ba4ff") { if (mapElem.originalAttrs.fill == "#5ba4ff") {
newData.areas[id] = { newData.areas[id] = {
@ -104,7 +104,7 @@ $(function(){
tooltip: {content : "Finistère (29)"}, tooltip: {content : "Finistère (29)"},
eventHandlers : { eventHandlers : {
click: function() {}, click: function() {},
dblclick: function(id, mapElem, textElem) { dblclick: function(e, id, mapElem, textElem) {
var newData = {'areas' : {}}; var newData = {'areas' : {}};
if (mapElem.originalAttrs.fill == "#5ba4ff") { if (mapElem.originalAttrs.fill == "#5ba4ff") {
newData.areas[id] = { newData.areas[id] = {

43
js/jquery.mapael.js
View File

@ -18,7 +18,8 @@
return this.each(function() { return this.each(function() {
var $tooltip = $("<div>").addClass(options.map.tooltip.cssClass).css("display", "none") var self = this
, $tooltip = $("<div>").addClass(options.map.tooltip.cssClass).css("display", "none")
, $container = $('.' + options.map.cssClass, this).empty().append($tooltip) , $container = $('.' + options.map.cssClass, this).empty().append($tooltip)
, mapConf = $.fn.mapael.maps[options.map.name] , mapConf = $.fn.mapael.maps[options.map.name]
, paper = new Raphael($container[0], mapConf.width, mapConf.height) , paper = new Raphael($container[0], mapConf.width, mapConf.height)
@ -76,6 +77,10 @@
if (options.map.zoom.enabled) if (options.map.zoom.enabled)
$.fn.mapael.initZoom($container, paper, mapConf.width, mapConf.height, options.map.zoom); $.fn.mapael.initZoom($container, paper, mapConf.width, mapConf.height, options.map.zoom);
// Create the legends for areas
if (options.legend.area.slices && options.legend.area.display)
areaLegend = $.fn.mapael.createLegend($(this), options, 'area', areas, 1);
/** /**
* *
* Update the current map * Update the current map
@ -178,35 +183,29 @@
if (options.map.width) { if (options.map.width) {
paper.setSize(options.map.width, mapConf.height * (options.map.width / mapConf.width)); paper.setSize(options.map.width, mapConf.height * (options.map.width / mapConf.width));
// Create the legends for areas and plots taking into account the scale of the map // Create the legends for plots taking into account the scale of the map
if (options.legend.area.slices && options.legend.area.display)
areaLegend = $.fn.mapael.createLegend($(this), options, 'area', areas, 1);
if (options.legend.plot.slices && options.legend.plot.display) if (options.legend.plot.slices && options.legend.plot.display)
plotLegend = $.fn.mapael.createLegend($(this), options, 'plot', plots, (options.map.width / mapConf.width)); plotLegend = $.fn.mapael.createLegend($(this), options, 'plot', plots, (options.map.width / mapConf.width));
} else { } else {
$(window).on('resize', function(){ $(window).on('resize', function() {
clearTimeout(resizeTO); clearTimeout(resizeTO);
resizeTO = setTimeout(function(){$container.trigger('resizeEnd');}, 150); resizeTO = setTimeout(function(){$container.trigger('resizeEnd');}, 150);
}); });
$container.on('resizeEnd', function(e) {
// Create the legends for plots taking into account the scale of the map
var createPlotLegend = function() {
if (options.legend.plot.slices && options.legend.plot.display)
plotLegend = $.fn.mapael.createLegend($(self), options, 'plot', plots, ($container.width() / mapConf.width));
$container.unbind('resizeEnd', createPlotLegend);
};
$container.on('resizeEnd', function() {
var containerWidth = $container.width(); var containerWidth = $container.width();
if (paper.width != containerWidth) { if (paper.width != containerWidth) {
paper.setSize(containerWidth, mapConf.height * (containerWidth / mapConf.width)); paper.setSize(containerWidth, mapConf.height * (containerWidth / mapConf.width));
} }
}); }).on('resizeEnd', createPlotLegend).trigger('resizeEnd');
(function(self, $container, options, areas, plots) {
$(document).on('ready', function(){
$container.trigger('resizeEnd');
// Create the legends for areas and plots taking into account the scale of the map
if (options.legend.area.slices && options.legend.area.display)
areaLegend = $.fn.mapael.createLegend($(self), options, 'area', areas, 1);
if (options.legend.plot.slices && options.legend.plot.display)
plotLegend = $.fn.mapael.createLegend($(self), options, 'plot', plots, ($container.width() / mapConf.width));
});
})(this, $container, options, areas, plots);
$container.trigger('resizeEnd');
} }
$(paper.desc).append(" and Mapael (http://neveldo.fr/mapael)"); $(paper.desc).append(" and Mapael (http://neveldo.fr/mapael)");
@ -298,8 +297,8 @@
$.fn.mapael.setEventHandlers = function(id, elemOptions, mapElem, textElem) { $.fn.mapael.setEventHandlers = function(id, elemOptions, mapElem, textElem) {
for(var event in elemOptions.eventHandlers) { for(var event in elemOptions.eventHandlers) {
(function(event) { (function(event) {
$(mapElem.node).on(event, function() {!$.fn.mapael.panning && elemOptions.eventHandlers[event](id, mapElem, textElem)}); $(mapElem.node).on(event, function(e) {!$.fn.mapael.panning && elemOptions.eventHandlers[event](e, id, mapElem, textElem)});
textElem && $(textElem.node).on(event, function() {!$.fn.mapael.panning && elemOptions.eventHandlers[event](id, mapElem, textElem)}); textElem && $(textElem.node).on(event, function(e) {!$.fn.mapael.panning && elemOptions.eventHandlers[event](e, id, mapElem, textElem)});
})(event); })(event);
} }
} }