diff --git a/README.md b/README.md index 6263c18..c0d7d0b 100644 --- a/README.md +++ b/README.md @@ -7,9 +7,14 @@ Build calendar graphs with unlimited chart layers #### [Month](https://github.com/YGGverse/graph-php/blob/main/src/Calendar/Month.php) -##### Example +![yggverse-graph-php-example](https://github.com/YGGverse/graph-php/assets/108541346/bbac7626-1f0b-476c-b154-f8a6f2933530) -![2 layers example](https://github.com/YGGverse/graph-php/blob/main/media/calendar/example-2-layers.png?raw=true) +##### Examples + + * [YGGstate](https://github.com/YGGverse/YGGstate) - Yggdrasil Network Explorer + * [HLState](https://github.com/YGGverse/HLState) - Web Monitor for Half-Life Servers + +##### Usage ###### Server-side @@ -27,7 +32,7 @@ foreach ($calendarMonth->getNodes() as $day => $node) $calendarMonth->addNode( $day, // required, number of day, on this example we are processing all of days in the initiated month rand(1, 1000), // required, set some digit value for this day and current layer - 'label 1', // optional, label text that could be displayed on element over + 'label 0', // optional, label text that could be displayed on element over 'class-name', // optional, customize output with CSS class 0 // optional, define chart layer if you want to build multiple charts in single day case // e.g. 1, 2, 3... or some keyword. first layer has 0 index by default. @@ -38,17 +43,20 @@ foreach ($calendarMonth->getNodes() as $day => $node) { // To build independent chart layer, make sure that layer attribute increased, for example to 1 $calendarMonth->addNode($day, rand(0, 1000), 'my hourly label 1, 'my-class-name-1', 1); - $calendarMonth->addNode($day, rand(0, 1000), 'my hourly label 1, 'my-class-name-1', 1); + $calendarMonth->addNode($day, rand(0, 1000), 'my hourly label 2, 'my-class-name-2', 1); } } ``` ###### Client-side -Coming soon on [YGGstate](https://github.com/YGGverse/YGGstate) or play with dump generated: + * [CSS](https://github.com/YGGverse/YGGstate/blob/main/src/public/assets/theme/default/css/yggverse/graph/calendar/month.css) + * [PHP/HTML](https://github.com/YGGverse/YGGstate/blob/main/src/public/index.php) + +To make your own implementation, play with: ``` var_dump( $calendarMonth->getNodes() ); -``` \ No newline at end of file +``` diff --git a/media/calendar/example-2-layers.png b/media/calendar/example-2-layers.png deleted file mode 100644 index 9a5491c..0000000 Binary files a/media/calendar/example-2-layers.png and /dev/null differ diff --git a/src/Calendar/Month.php b/src/Calendar/Month.php index ccb6719..9a0bacf 100644 --- a/src/Calendar/Month.php +++ b/src/Calendar/Month.php @@ -2,7 +2,7 @@ declare(strict_types=1); -namespace YGGverse\Graph\Calendar; +namespace Yggverse\Graph\Calendar; class Month { @@ -35,18 +35,19 @@ class Month public function getNodes() : object { - // Calculate month totals - $total = []; + // Calculate max value + $max = 0; foreach ($this->_node as $i => $day) { foreach ($day as $l => $layer) { - $total[$i][$l] = 0; - foreach ($layer as $data) { - $total[$i][$l] += $data['value']; + if ($data['value'] > $max) + { + $max = $data['value']; + } } } } @@ -66,8 +67,8 @@ class Month // Calculate column width, height, offset foreach ($layer as $j => $data) { + $this->_node[$i][$l][$j]['height'] = $max ? ceil($data['value'] / $max * 100) : 0; $this->_node[$i][$l][$j]['width'] = $width; - $this->_node[$i][$l][$j]['height'] = $total[$i][$l] ? ceil($data['value'] / $total[$i][$l] * 100) : 0; $this->_node[$i][$l][$j]['offset'] = $width * $j; } }