1. Go to this page and download the library: Download modernik/mlm-tree-view library. Choose the download type require.
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
modernik / mlm-tree-view example snippets
use Modernik\MlmTreeView\GenericTreeNode;
use Modernik\MlmTreeView\Placement\CenteredTreeLayoutEngine;
use Modernik\MlmTreeView\Renderer\BasicHtmlTreeRenderer;
$ternary = new GenericTreeNode(1, 'ROOT', [
new GenericTreeNode(2, 'A', [
new GenericTreeNode(3, 'A1'),
new GenericTreeNode(4, 'A2'),
new GenericTreeNode(5, 'A3'),
]),
new GenericTreeNode(6, 'B', [
new GenericTreeNode(7, 'B1'),
new GenericTreeNode(8, 'B2'),
new GenericTreeNode(9, 'B3'),
]),
new GenericTreeNode(10, 'C', [
new GenericTreeNode(11, 'C1'),
new GenericTreeNode(12, 'C2'),
new GenericTreeNode(13, 'C3'),
])
]);
// Création du renderer
$layout = new CenteredTreeLayoutEngine();
$renderer = new BasicHtmlTreeRenderer($layout, true);
public function __construct(
private int $nodeWidth = 120,
private int $nodeHeight = 60,
private int $spaceX = 60,
private int $spaceY = 100,
private string $orientation = self::ORIENTATION_HORIZONTAL
) {
}
class MyCustomTreeLayoutEngine implements TreeLayoutEngine
{
/**
* @inheritDoc
*/
public function layout(TreeNode $root): PositionedTreeNode
{
//Calcule et retourne un arbre positionné à partir d'un arbre logique.
}
/**
* @inheritDoc
*/
public function getBound() : Bound
{
// calcul de la taille de l'espace de travail
}
/**
* @inheritDoc
*/
public function getOrientation() : string
{
//Renvoie la configuration de l'orientation du layout
}
}
public function __construct(TreeLayoutEngine $layoutEngine, bool $withStyle = true)
{
}
public function __construct( TreeLayoutEngine $layoutEngine, LinkGenerator $linkGenerator, bool $withStyle = true )
{
}
bash
php -S localhost:8989 -t ./web/
css
.mlm-tree-view-container {
/* personnalisation du conteneur principale */
}
.mlm-tree-node {
/* Personnalisation du conteneur d'un noeud */
}
.mlm-tree-node-content {
/* Personnalisation du conteneur des contenus d'un noeud */
}
.mlm-tree-view-container path {
/* Personnalisation des paths qui lie les noeuds de l'arbre */
}
/* Animation */
@keyframes fadeInUp {
/* Animation des noeuds de l'arbre */
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes drawPath {
/* Animation paths qui lie les noeuds de l'arbre */
to {
stroke-dashoffset: 0;
}
}
Loading please wait ...
Before you can download the PHP files, the dependencies should be resolved. This can take some minutes. Please be patient.