tyler.durden/pandorafms
1
0
Fork 0
mirror of https://github.com/pandorafms/pandorafms.git synced 2025-07-31 01:35:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fixed there are many bullet charts in one page (such as dashboard). TICKET: #3187

Browse Source 
(cherry picked from commit 11f9f2ec3295289f2e05628d18ab2e4d8d401181)
This commit is contained in:
mdtrooper 2016-01-11 15:18:13 +01:00
parent a5f8a9ca24
commit ed78a4e44f
1 changed files with 47 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
pandora_console/include/graphs/functions_d3.php
View File

@ -142,23 +142,25 @@ function d3_sunburst_graph ($data, $width = 700, $height = 700, $return = false)
} }
function d3_bullet_chart($chart_data, $width, $height, $color, $legend, function d3_bullet_chart($chart_data, $width, $height, $color, $legend,
$homeurl, $unit, $font, $font_size) { $homeurl, $unit, $font, $font_size) {
global $config; global $config;
$output = ''; $output = '';
$output .= include_javascript_d3(true); $output .= include_javascript_d3(true);
$id_bullet = uniqid();
$output .= $output .=
'<div id="bullet_graph" style="overflow: hidden;"></div> '<div id="bullet_graph_' . $id_bullet . '" class="bulle" style="overflow: hidden;"></div>
<style> <style>
#bullet_graph { .bullet_graph {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: auto; margin: auto;
padding-top: 40px; padding-top: 40px;
position: relative; position: relative;
width: 100%; width: 100%;
} }
.bullet { font: 7px sans-serif; } .bullet { font: 7px sans-serif; }
@ -209,46 +211,46 @@ function d3_bullet_chart($chart_data, $width, $height, $color, $legend,
$output .= 'var data = [' $output .= 'var data = ['
. implode(",",$temp) . ']; . implode(",",$temp) . '];
'; ';
$output .= ' $output .= '
var svg = d3.select("#bullet_graph").selectAll("svg") var svg = d3.select("#bullet_graph_' . $id_bullet . '").selectAll("svg")
.data(data) .data(data)
.enter().append("svg") .enter().append("svg")
.attr("class", "bullet") .attr("class", "bullet")
.attr("width", "100%") .attr("width", "100%")
.attr("height", height+ margin.top + margin.bottom) .attr("height", height+ margin.top + margin.bottom)
.append("g") .append("g")
.attr("transform", "translate(" + (margin.left) + "," + margin.top + ")") .attr("transform", "translate(" + (margin.left) + "," + margin.top + ")")
.call(chart); .call(chart);
var title = svg.append("g") var title = svg.append("g")
.style("text-anchor", "end") .style("text-anchor", "end")
.attr("transform", "translate(-20," + height + ")"); .attr("transform", "translate(-20," + height + ")");
title.append("text") title.append("text")
.attr("class", "title") .attr("class", "title")
.text(function(d) { return d.title; }); .text(function(d) { return d.title; });
title.append("text") title.append("text")
.attr("class", "subtitle") .attr("class", "subtitle")
.attr("dy", "1em") .attr("dy", "1em")
.text(function(d) { return d.subtitle; }); .text(function(d) { return d.subtitle; });
$(".tick>text").each(function() { $(".tick>text").each(function() {
label = $(this).text().replace(/,/g,""); label = $(this).text().replace(/,/g,"");
label = parseFloat(label); label = parseFloat(label);
text = label.toLocaleString(); text = label.toLocaleString();
if ( label >= 1000000) if ( label >= 1000000)
text = text.substring(0,3) + "M"; text = text.substring(0,3) + "M";
else if (label >= 100000) else if (label >= 100000)
text = text.substring(0,3) + "K"; text = text.substring(0,3) + "K";
else if (label >= 1000) else if (label >= 1000)
text = text.substring(0,2) + "K"; text = text.substring(0,2) + "K";
$(this).text(text); $(this).text(text);
}); });
</script>'; </script>';
return $output; return $output;