nicolas/librenms
1
0
Fork 0
mirror of https://github.com/stylersnico/librenms.git synced 2026-07-28 08:02:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

Drawing squares and circles in the legend taking account the scale of the map

Browse Source
This commit is contained in:
Vincent Broute
2013-09-21 21:15:27 +02:00
parent 1b15729196
commit 0dbd62720e
1 changed files with 28 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
js/jquery.mapael.js
+28 -18
View File
@@ -72,13 +72,6 @@
$.fn.mapael.initElem(paper, plots[id], elemOptions, $tooltip);
}
// Create the legends for areas and plots
if (options.legend.area.slices && options.legend.area.display)
areaLegend = $.fn.mapael.createLegend($(this), options, 'area', areas);
if (options.legend.plot.slices && options.legend.plot.display)
plotLegend = $.fn.mapael.createLegend($(this), options, 'plot', plots);
// Enable zoom
if (options.map.zoom.enabled)
$.fn.mapael.initZoom($container, paper, mapConf.width, mapConf.height, options.map.zoom);
@@ -184,18 +177,35 @@
// Handle resizing of the map
if (options.map.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
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)
plotLegend = $.fn.mapael.createLegend($(this), options, 'plot', plots, (options.map.width / mapConf.width));
} else {
$(window).on('resize', function(){
clearTimeout(resizeTO);
resizeTO = setTimeout(function(){$container.trigger('resizeEnd');}, 150);
});
$(document).on('ready', function(){$container.trigger('resizeEnd');});
$container.on('resizeEnd', function(e) {
var containerWidth = $container.width();
if (paper.width != containerWidth) {
paper.setSize(containerWidth, mapConf.height * (containerWidth / mapConf.width));
}
});
(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');
}
@@ -374,7 +384,7 @@
* @param options map options
* @param legendType the type of the legend : 'area' or 'plot'
*/
$.fn.mapael.createLegend = function ($container, options, legendType, elems) {
$.fn.mapael.createLegend = function ($container, options, legendType, elems, scale) {
var legendOptions = options.legend[legendType]
, $legend = (legendType == 'plot') ? $('.' + options.legend.plot.cssClass, $container).empty() : $('.' + options.legend.area.cssClass, $container).empty()
, paper = new Raphael($legend.get(0))
@@ -413,25 +423,25 @@
elem = paper.rect(
legendOptions.marginLeft
, height
, legendOptions.slices[i].size
, legendOptions.slices[i].size
, scale * (legendOptions.slices[i].size)
, scale * (legendOptions.slices[i].size)
).attr(legendOptions.slices[i].attrs);
} else {
elem = paper.circle(
legendOptions.marginLeft + legendOptions.slices[i].size / 2
, height + legendOptions.slices[i].size / 2
, legendOptions.slices[i].size / 2
legendOptions.marginLeft + scale * (legendOptions.slices[i].size / 2)
, height + scale * (legendOptions.slices[i].size / 2)
, scale * (legendOptions.slices[i].size / 2)
).attr(legendOptions.slices[i].attrs);
}
label = paper.text(
legendOptions.marginLeft + legendOptions.slices[i].size + legendOptions.marginLeftLabel
, height + legendOptions.slices[i].size / 2
legendOptions.marginLeft + scale * legendOptions.slices[i].size + legendOptions.marginLeftLabel
, height + scale * (legendOptions.slices[i].size / 2)
, legendOptions.slices[i].label
).attr(legendOptions.labelAttrs);
height += legendOptions.marginBottom + legendOptions.slices[i].size;
width = Math.max(width, legendOptions.marginLeft + legendOptions.slices[i].size + legendOptions.marginLeftLabel + label.getBBox().width);
height += legendOptions.marginBottom + scale * legendOptions.slices[i].size;
width = Math.max(width, legendOptions.marginLeft + scale * legendOptions.slices[i].size + legendOptions.marginLeftLabel + label.getBBox().width);
if (legendOptions.hideElemsOnClick.enabled) {
// Hide/show elements when user clicks on a legend element