Multi-line graph with tight X-axis and aligned labels
The code below is the source for this graph.
<?php
// Multi-line graph with tight X-axis and aligned labels
require_once 'SVGGraph/autoloader.php';
function format_label($d, $k, $v)
{
return "X: " . new Goat1000\SVGGraph\Number($k) . "\nY: " .
new Goat1000\SVGGraph\Number($v);
}
$options = [
'auto_fit' => true,
'structure' => [
'key' => 0,
'value' => [1, 2, 3, 4],
],
'data_label_font_weight' => 'bold',
'marker_type' => 'square',
'marker_size' => 4,
'grid_division_h' => 10,
'show_data_labels' => true,
'data_label_filter' => ["10", "10+3", "10+6"],
'data_label_type' => 'linebox',
'data_label_position' => 'above 0 -10',
'data_label_padding' => 4,
'data_label_tail_end' => 'point',
'data_label_tail_length' => 10,
'data_label_fill' => ['#eef','#fee','#ffd'],
'pad_top' => 40,
'tooltip_padding' => 4,
'back_shadow' => 3,
'back_stroke_width' => 0,
'back_colour' => '#fcfcfc',
'show_shadow' => true,
'shadow_opacity' => 0.3,
'data_label_callback' => 'format_label',
'tooltip_callback' => 'format_label',
'axis_tightness_x' => 1,
'data_label_align' => 'left',
'tooltip_align' => 'left',
];
$values = [];
$m = 100;
$o = 120;
for($i = 0; $i <= 41; $i += 1) {
$s = sin(deg2rad($i * 4)) * $m;
$c = cos(deg2rad($i * 4)) * $m;
$values[] = [ $i, $o + $s, $o + $c, $o + $s - $c ];
}
$graph = new Goat1000\SVGGraph\SVGGraph(670, 300, $options);
$graph->values($values);
$graph->render('MultiLineGraph');
Please note: the source code above comes from a script used to generate one of the example graphs on the site. This is simply a wrapper page to apply highlighting and make the source code easier to read, so there is no content here to describe what the source code is doing.