{"id":33988357,"url":"https://github.com/codeagent/treemap","last_synced_at":"2025-12-13T05:56:06.822Z","repository":{"id":56954826,"uuid":"61539028","full_name":"codeagent/treemap","owner":"codeagent","description":"Treemap generator for php","archived":false,"fork":false,"pushed_at":"2017-03-14T15:56:33.000Z","size":261,"stargazers_count":3,"open_issues_count":5,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-03T13:12:22.307Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://codeagent.github.io/treemap/","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codeagent.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-06-20T10:29:15.000Z","updated_at":"2025-03-19T13:22:12.000Z","dependencies_parsed_at":"2022-08-21T08:50:13.438Z","dependency_job_id":null,"html_url":"https://github.com/codeagent/treemap","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/codeagent/treemap","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeagent%2Ftreemap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeagent%2Ftreemap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeagent%2Ftreemap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeagent%2Ftreemap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codeagent","download_url":"https://codeload.github.com/codeagent/treemap/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeagent%2Ftreemap/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":27621437,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-12-09T02:00:09.185Z","response_time":54,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-12-13T05:56:06.170Z","updated_at":"2025-12-13T05:56:06.816Z","avatar_url":"https://github.com/codeagent.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"Sometimes we need to convenient represent hierarchical data structures such as file system. \nOne of the famous methods is a treemap. This **php package** provides you to build treemaps in formats of html, canvas and image from native php multiarrays. \nSpecial architecture of classes gives you an opportunity for customization at level of one node: node content, node color and other.\n\nSee [demos](https://codeagent.github.io/treemap/).\n\nMore info about treemaps you may see in [wiki](https://en.wikipedia.org/wiki/Treemapping). \n\n## Installation\nInstall the latest version via composer:\n\n```\ncomposer require codeagent\\treemap\n```\n\nAlso, it's necessary to plug in required css-styles to your page for correct display of html markup. \nYou can do that by copying `treemap.css` file to web-accessible folder of your\nserver. To do that, simply run `vendor/bin/treemap` command with target directory as argument. Then you need to include it into the head section of page via `\u003clink\u003e` tag, \nfor example `\u003clink rel=\"stylesheet\" href=\"assets/treemap.css\" /\u003e`\n\n## Basic usage\nInclude composer’s autoloader and inject `Treemap` class from `codeagent\\treemap` namespace into php script. \nMap is waiting at the entrance your data as first argument, width and height as second and third arguments respectively. \nTo obtain the result of rendering (html markup, image), call `render` method of `Presenter` interface:\n\n```php\ninclude(\"vendor/autoload.php\");\nuse codeagent\\treemap\\Treemap;\n\n// your data in consistent format\n$data = [[\"value\" =\u003e 2, \"children\" =\u003e [...]], [\"value\" =\u003e \"4\", \"children\" =\u003e [...]], [...], ...]; \n$presenter = Treemap::html($data, 1200, 800);\necho $presenter-\u003erender();\n```\n\nBy default, Treemap class considers, that \"weight\" non-negative value are located in the `value` attribute and the\n\"children\" nodes addressed via correspond `children` key of node. \nIf it is not suitable for you, you can tell  treemap which keys to pick explicitly:\n\n```php\n$treemap = new Treemap($data, 1200, 800);\n$treemap-\u003evalueAttribute = \"volume\";\n$treemap-\u003echildrenAttribute = \"department\";\n```\n\nAnd then draw treemap using appropriate Presenter:\n\n```php\n$presenter = new HtmlPresenter($treemap);\necho $presenter-\u003erender();\n```\n\nNot forget to inject presenter class to you script via `use` statement.\n\n\n## Advanced usage\n### Formats of representation\nOf course, presentation of treemap does not limited only by html. \nBesides html there are classes for building images and canvas elements in this package.\n\n```php\ninclude(\"vendor/autoload.php\");\nuse codeagent\\treemap\\Treemap;\nuse codeagent\\treemap\\presenter\\HtmlPresenter;\nuse codeagent\\treemap\\presenter\\NestedHtmlPresenter;\nuse codeagent\\treemap\\presenter\\CanvasPresenter;\nuse codeagent\\treemap\\presenter\\ImagePresenter;\n\n$data = [...]; // your hierarhical data\nconst WIDTH = 1200;\nconst HEIGHT = 800;\n$treemap = new Treemap($data, WIDTH, HEIGHT);\n\n$html = (new HtmlPresenter($treemap))-\u003erender(); \n// same as  $html = Treemap::html($data, WIDTH, HEIGHT)-\u003erender();\necho $html;\n\n$canvas = (new CanvasPresenter($treemap))-\u003erender(); \n// same as  $canvas = Treemap::canvas($data, WIDTH, HEIGHT)-\u003erender();\necho $canvas;\n\n$image = (new ImagePresenter($treemap, \"png\"))-\u003erender();\n// same as $image = Treemap::image($data, WIDTH, HEIGHT, \"png\")-\u003erender();\n\nheader(\"Content-Type: image/png\");\necho $image;\n```\n\n`ImagePresenter` outputs image in form of raw data. \nFor this reason, pass appropriate content-type header with image data: `header(\"Content-Type: image/png\")`.\nIt is worth noting the `NestedtmlPresenter`. In fact, it is a collection of treemaps with different detalization degree, \nwhich gives you conveniently navigate from one map to another via headers and breadcrumbs at top of presenter.\n\n### Custom node styles\nPresenter interface gives an ability to adjust a single node rendering via a utility `Nodeinfo` class, for example:\n```php\nuse codeagent\\treemap\\Treemap;\nuse codeagent\\treemap\\presenter\\HtmlPresenter;\nuse codeagent\\treemap\\presenter\\NodeInfo;\n\n$presenter = Treemap::html($data, $width, $height)\n    -\u003erender(function(NodeIndo $node){\n        $data = $node-\u003edata();\t\n        $node-\u003econtent()-\u003ehtml(\"\u003cspan\u003e{$data['name']}\u003c/span\u003e\");\n        $node-\u003ebackground(\"calculated_color_here\");\n    });\n```\n\n`NodeInfo` api provides an access to node information:\n\n - **background()** - sets/gets background color of node\n - **content()** - access to content of node (NodeContent)\n - **rectangle()** - access to geometry (rectangle) of node\n - **level()** - depth of node (0 is root Node)\n - **isLeaf()** - whether node is leaf\n - **isRoot()** - whether node is root\n - **id()** - order between node siblings\n - **visible()** - whether node is visible/not\n - **data()** - node data\n\n\n## License\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeagent%2Ftreemap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodeagent%2Ftreemap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeagent%2Ftreemap/lists"}