infographic-generator-p5

Community

Generate interactive infographics with p5.js.

Authorvishalsachdev
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This skill converts vis-network JSON data into a standalone, interactive infographic implemented in p5.js, emphasizing hover tooltips and a bottom detail panel for descriptions.

Core Features & Use Cases

  • P5.js infographics: read vis-network data to render nodes and edges with hover tooltips.
  • Fixed layout with details panel: information shown in a dedicated control region below the drawing area.
  • Data-driven visuals: supports JSON data for rapid visualization.

Quick Start

Provide your data.json, then run the skill to generate index.md, main.html, and the p5 sketch file for interactive exploration.

Dependency Matrix

Required Modules

p5.js

Components

assets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: infographic-generator-p5
Download link: https://github.com/vishalsachdev/database-management/archive/main.zip#infographic-generator-p5

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository