\n";
print "\n";
}
function svg_options($options)
{
foreach ($options as $key => $value) {
print "$key=\"$value\" ";
}
}
function svg_group($options)
{
print "\n";
}
function svg_group_end()
{
print "\n";
}
function svg_text($x, $y, $text, $options = array())
{
printf("$text\n";
}
function svg_line($x1, $y1, $x2, $y2, $options = array())
{
printf("\n";
}
function svg_rect($x, $y, $w, $h, $options = array())
{
printf("\n";
}
function svg_poly($points, $options = array())
{
print "\n";
}
function allocate_color($colors)
{
$col['rgb'] = sprintf("#%02X%02X%02X", $colors[0], $colors[1], $colors[2]);
$col['opacity'] = sprintf("%F", (127 - $colors[3]) / 127);
return $col;
}
function init_image()
{
global $xlm, $xrm, $ytm, $ybm, $iw, $ih,$graph, $cl, $iface, $colorscheme, $style;
if ($graph == 'none')
return;
//
// image object
//
$xlm = 70;
$xrm = 20;
$ytm = 35;
$ybm = 60;
if ($graph == 'small')
{
$iw = 300 + $xrm + $xlm;
$ih = 100 + $ytm + $ybm;
}
else
{
$iw = 600 + $xrm + $xlm;
$ih = 200 + $ytm + $ybm;
}
svg_create($iw, $ih);
//
// colors
//
$cs = $colorscheme;
$cl['image_background'] = allocate_color($cs['image_background']);
$cl['background'] = allocate_color($cs['graph_background']);
$cl['background_2'] = allocate_color($cs['graph_background_2']);
$cl['grid_stipple_1'] = allocate_color($cs['grid_stipple_1']);
$cl['grid_stipple_2'] = allocate_color($cs['grid_stipple_2']);
$cl['text'] = allocate_color($cs['text']);
$cl['border'] = allocate_color($cs['border']);
$cl['rx'] = allocate_color($cs['rx']);
$cl['rx_border'] = allocate_color($cs['rx_border']);
$cl['tx'] = allocate_color($cs['tx']);
$cl['tx_border'] = allocate_color($cs['tx_border']);
svg_rect(0, 0, $iw, $ih, array( 'stroke' => 'none', 'stroke-width' => 0, 'fill' => $cl['image_background']['rgb']) );
svg_rect($xlm, $ytm, $iw-$xrm-$xlm, $ih-$ybm-$ytm, array( 'stroke' => 'none', 'stroke-width' => 0, 'fill' => $cl['background']['rgb']) );
$depth = 12*SVG_DEPTH_SCALING;
svg_group( array( 'stroke' => 'none', 'stroke-width' => 0, 'fill' => $cl['background_2']['rgb'], 'fill-opacity' => $cl['background_2']['opacity']) );
svg_poly(array($xlm, $ytm, $xlm, $ih - $ybm, $xlm - $depth, $ih - $ybm + $depth, $xlm - $depth, $ytm + $depth));
svg_poly(array($xlm, $ih - $ybm, $xlm - $depth, $ih - $ybm + $depth, $iw - $xrm - $depth, $ih - $ybm + $depth, $iw - $xrm, $ih - $ybm));
svg_group_end();
// draw title
$text = T('Traffic data for')." $iface";
svg_text($iw / 2, ($ytm / 2), $text, array( 'stroke' => 'none', 'fill' => $cl['text']['rgb'],'stroke-width' => 0, 'font-family' => SVG_FONT, 'font-weight' => 'bold', 'text-anchor' => 'middle' ));
}
function draw_border()
{
global $cl, $iw, $ih;
svg_rect(1, 1, $iw-2, $ih-2, array( 'stroke' => $cl['border']['rgb'], 'stroke-opacity' => $cl['border']['opacity'], 'stroke-width' => 1, 'fill' => 'none') );
}
function draw_grid($x_ticks, $y_ticks)
{
global $cl, $iw, $ih, $xlm, $xrm, $ytm, $ybm;
$x_step = ($iw - $xlm - $xrm) / ($x_ticks ?: 1);
$y_step = ($ih - $ytm - $ybm) / $y_ticks;
$depth = 12*SVG_DEPTH_SCALING;
svg_group( array( 'stroke' => $cl['grid_stipple_1']['rgb'], 'stroke-opacity' => $cl['grid_stipple_1']['opacity'], 'stroke-width' => '1px', 'stroke-dasharray' => '1,1' ) );
for ($i = $xlm; $i <= ($iw - $xrm); $i += $x_step)
{
svg_line($i, $ytm, $i, $ih-$ybm);
svg_line($i, $ih-$ybm, $i-$depth, $ih-$ybm+$depth);
}
for ($i = $ytm; $i <= ($ih - $ybm); $i += $y_step)
{
svg_line($xlm, $i, $iw - $xrm, $i);
svg_line($xlm, $i, $xlm - $depth, $i + $depth);
}
svg_group_end();
svg_group( array( 'stroke' => $cl['border']['rgb'], 'stroke-width' => '1px', 'stroke-opacity' => $cl['border']['opacity'] ) );
svg_line($xlm, $ytm, $xlm, $ih - $ybm);
svg_line($xlm, $ih - $ybm, $iw - $xrm, $ih - $ybm);
svg_group_end();
}
function draw_data($data)
{
global $cl,$iw,$ih,$xlm,$xrm,$ytm,$ybm;
sort($data);
$x_ticks = count($data);
$y_ticks = 10;
$y_scale = 1;
$prescale = 1;
$unit = 'K';
$offset = 0;
$gr_h = $ih - $ytm - $ybm;
$x_step = ($iw - $xlm - $xrm) / ($x_ticks ?: 1);
$y_step = ($ih - $ytm - $ybm) / $y_ticks;
$bar_w = ($x_step / 2);
// 找出最大值
$low = 99999999999;
$high = 0;
for ($i=0; $i<$x_ticks; $i++)
{
if ($data[$i]['rx'] < $low)
$low = $data[$i]['rx'];
if ($data[$i]['tx'] < $low)
$low = $data[$i]['tx'];
if ($data[$i]['rx'] > $high)
$high = $data[$i]['rx'];
if ($data[$i]['tx'] > $high)
$high = $data[$i]['tx'];
}
// 新的单位转换逻辑
$high = $high * 1.2; // 增加20%余量，避免数据触顶
// 自动选择合适的单位
if ($high < 1024) {
$unit = 'K';
} else if ($high < 1048576) { // 1024 * 1024
$unit = 'M';
$prescale = 1024;
$high = $high / 1024;
} else if ($high < 1073741824) { // 1024 * 1024 * 1024
$unit = 'G';
$prescale = 1048576;
$high = $high / 1048576;
} else {
$unit = 'T';
$prescale = 1073741824;
$high = $high / 1073741824;
}
// 计算合适的刻度
$y_scale = ceil($high / $y_ticks);
// 确保最小刻度
if ($y_scale < 1) {
$y_scale = 1;
}
draw_grid($x_ticks, $y_ticks);
// 图表缩放因子（每像素）
$sf = ($prescale * $y_scale * $y_ticks) / $gr_h;
if (count($data) == 0)
{
$text = T('no data available');
svg_text($iw/2, $ytm + 80, $text, array(
'stroke' => 'none',
'fill' => $cl['text']['rgb'],
'stroke-width' => 0,
'font-family' => SVG_FONT,
'font-size' => '16pt',
'text-anchor' => 'middle'
));
}
else
{
// 绘制柱状图
for ($i=0; $i<$x_ticks; $i++)
{
$x = $xlm + ($i * $x_step);
$y = $ytm + ($ih - $ytm - $ybm) - (($data[$i]['rx'] - $offset) / $sf);
$depth = ($x_ticks < 20) ? 8*SVG_DEPTH_SCALING : 6*SVG_DEPTH_SCALING;
$space = 0;
$x1 = (int)$x;
$y1 = (int)$y;
$w = (int)($bar_w - $space);
$h = (int)($ih - $ybm - $y);
$x2 = (int)($x + $bar_w - $space);
$y2 = (int)($ih - $ybm);
svg_group( array( 'stroke' => $cl['rx_border']['rgb'], 'stroke-opacity' => $cl['rx_border']['opacity'],
'stroke-width' => 1, 'stroke-linejoin' => 'round',
'fill' => $cl['rx']['rgb'], 'fill-opacity' => $cl['rx']['opacity'] ) );
svg_rect($x1, $y1, $w, $h);
svg_rect($x1 - $depth, $y1 + $depth, $w, $h);
svg_poly(array($x1, $y1, $x2, $y1, $x2 - $depth, $y1 + $depth, $x1 - $depth, $y1 + $depth));
svg_poly(array($x2, $y1, $x2, $y2, $x2 - $depth, $y2 + $depth, $x2 - $depth, $y1 + $depth));
svg_group_end();
$y1 = (int)($ytm + ($ih - $ytm - $ybm) - (($data[$i]['tx'] - $offset) / $sf));
$x1 = (int)($x1 + $bar_w);
$x2 = (int)($x2 + $bar_w);
$w = (int)($bar_w - $space);
$h = (int)($ih - $ybm - $y1 - 1);
svg_group( array( 'stroke' => $cl['tx_border']['rgb'], 'stroke-opacity' => $cl['tx_border']['opacity'],
'stroke-width' => 1, 'stroke-linejoin' => 'round',
'fill' => $cl['tx']['rgb'], 'fill-opacity' => $cl['tx']['opacity'] ) );
svg_rect($x1, $y1, $w, $h);
svg_rect($x1 - $depth, $y1 + $depth, $w, $h);
svg_poly(array($x1, $y1, $x2, $y1, $x2 - $depth, $y1 + $depth, $x1 - $depth, $y1 + $depth));
svg_poly(array($x2, $y1, $x2, $y2, $x2 - $depth, $y2 + $depth, $x2 - $depth, $y1 + $depth));
svg_group_end();
}
// 绘制坐标轴标签
svg_group(array(
'fill' => $cl['text']['rgb'],
'fill-opacity' => $cl['text']['opacity'],
'stroke-width' => '0',
'font-family' => SVG_FONT,
'font-size' => '10pt',
'text-anchor' => 'end'
));
// Y轴刻度标签
for ($i=0; $i<=$y_ticks; $i++)
{
$label = ($i * $y_scale).$unit;
$tx = $xlm - 16;
$ty = ($ih - $ybm) - ($i * $y_step) + 8;
svg_text($tx, $ty, $label);
}
svg_group_end();
// X轴标签
svg_group(array(
'fill' => $cl['text']['rgb'],
'fill-opacity' => $cl['text']['opacity'],
'stroke-width' => '0',
'font-family' => SVG_FONT,
'font-size' => '10pt',
'text-anchor' => 'middle'
));
for ($i=0; $i<$x_ticks; $i++)
{
$label = $data[$i]['img_label'];
svg_text(
$xlm + ($i * $x_step) + ($x_step / 2),
$ih - $ybm + 20,
$label
);
}
svg_group_end();
}
draw_border();
// 图例
svg_rect($xlm, $ih-$ybm+39, 8, 8, array(
'stroke' => $cl['text']['rgb'],
'stroke-width' => 1,
'fill' => $cl['rx']['rgb']
));
svg_text($xlm+14, $ih-$ybm+48, T('bytes in'), array(
'fill' => $cl['text']['rgb'],
'stroke-width' => 0,
'font-family' => SVG_FONT,
'font-size' => '8pt'
));
svg_rect($xlm+120, $ih-$ybm+39, 8, 8, array(
'stroke' => $cl['text']['rgb'],
'stroke-width' => 1,
'fill' => $cl['tx']['rgb']
));
svg_text($xlm+134, $ih-$ybm+48, T('bytes out'), array(
'fill' => $cl['text']['rgb'],
'stroke-width' => 0,
'font-family' => SVG_FONT,
'font-size' => '8pt'
));
}
function output_image()
{
global $page,$hour,$day,$month,$iface;
if ($page == 'summary')
return;
init_image();
if ($page == 'h')
{
draw_data($hour);
}
else if ($page == 'd')
{
draw_data($day);
}
else if ($page == 'm')
{
draw_data($month);
}
svg_end();
}
get_vnstat_data();
output_image();
?>