Compare commits

...

12 commits
0.1.0 ... main

Author SHA1 Message Date
ghost
b6d6685416 use max value of month as 100% height 2024-01-24 03:06:03 +02:00
ghost
291059ea96 replace round to ceil 2024-01-24 02:31:13 +02:00
ghost
72ee9ec227 add height calculation modes, month by default 2024-01-24 02:25:56 +02:00
ghost
cdc2217187 update examples 2024-01-24 02:25:09 +02:00
ghost
5e50c06e0b Merge remote-tracking branch 'refs/remotes/origin/main' 2024-01-24 02:24:12 +02:00
d47081
405625337c
update preview location 2024-01-24 02:21:11 +02:00
ghost
ba577fed13 remove media files from package 2024-01-24 02:17:55 +02:00
ghost
6202bc8163 fix namespace 2023-10-09 04:50:13 +03:00
ghost
a678a03894 fix example url 2023-08-16 12:37:23 +03:00
ghost
7dca03ee52 update readme 2023-08-13 21:48:07 +03:00
ghost
c0969363b6 update readme 2023-08-13 21:45:06 +03:00
ghost
5875b46481 fix example 2023-08-09 15:37:31 +03:00
3 changed files with 22 additions and 13 deletions

View file

@ -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()
);
```
```

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.9 KiB

View file

@ -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;
}
}