evo-d3v6-stock-visualization

SkillFiles & storage

Generates the complete visualization.js file implementing a D3.js v6 force-simulation bubble chart with sector clustering, an interactive data table, tooltips, legends, and bidirectional click-based highlighting between chart and table.

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the evo-d3v6-stock-visualization skill

What this skill tells your AI

The instructions your AI receives, as published by openlair/openskill in tasks-evolved/data-to-d3/environment/skills/evo-d3v6-stock-visualization/SKILL.md and read by ahel’s review.

Generates visualization.js with D3.js v6 force-simulation bubble chart, data table, and interactions.

Usage

import sys
sys.path.insert(0, '/app/environment/skills/evo-d3v6-stock-visualization/scripts')
from utils import generate_visualization_js

generate_visualization_js('/root/output/js/visualization.js')

Functions

  • generate_visualization_js(output_path) - Generates complete visualization.js
  • build_force_simulation_code() - Returns JS for force simulation with sector clustering
  • build_bubble_chart_code() - Returns JS for SVG bubble chart with labels, legend, tooltip
  • build_data_table_code() - Returns JS for HTML data table with formatted market cap
  • build_interaction_code() - Returns JS for bidirectional click highlighting
  • format_market_cap_js() - Returns JS function to format numbers as 1.64T, 232.51B, etc.

Key Design Decisions

  • D3 v6 event signature: (event, d) not (d, i)
  • scaleSqrt for area-proportional bubble sizing
  • ETFs get uniform radius (no marketCap data)
  • No tooltip shown for ETF entries
  • forceX/forceY with sector-specific coordinates for clustering
  • forceCollide prevents overlap
  • Bidirectional click: bubble click highlights table row (scrolls into view), table row click highlights bubble

Signals

GitHub stars
89
Forks
4
Last commit
Sep 2026
Advanced
Catalog kind
skill
Gateway key
evo-d3v6-stock-visualization
Source
github.com/openlair/openskill