refactor(viz-platform): extract skills and slim commands
Extract shared knowledge from 10 commands into 7 reusable skills: - mcp-tools-reference.md: All viz-platform MCP tool signatures - theming-system.md: Theme tokens, CSS variables, color palettes - accessibility-rules.md: WCAG contrast, color-blind safe palettes - dmc-components.md: DMC categories, validation, common props - responsive-design.md: Breakpoints, mobile-first, grid config - chart-types.md: Plotly chart types, export formats, resolution - layout-templates.md: Dashboard templates, filter types All commands now reference skills via "Skills to Load" section. Commands reduced from 1396 lines total to 427 lines (69% reduction). Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,19 +4,19 @@ description: Export a Plotly chart to PNG, SVG, or PDF format
|
||||
|
||||
# Export Chart
|
||||
|
||||
## Skills to Load
|
||||
- skills/mcp-tools-reference.md
|
||||
- skills/chart-types.md
|
||||
|
||||
## Visual Output
|
||||
|
||||
When executing this command, display the plugin header:
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────────────┐
|
||||
│ 🎨 VIZ-PLATFORM · Chart Export │
|
||||
└──────────────────────────────────────────────────────────────────┘
|
||||
+------------------------------------------------------------------+
|
||||
| VIZ-PLATFORM - Chart Export |
|
||||
+------------------------------------------------------------------+
|
||||
```
|
||||
|
||||
Then proceed with the export.
|
||||
|
||||
Export a Plotly chart to static image formats for sharing, embedding, or printing.
|
||||
Export a Plotly chart to static image formats.
|
||||
|
||||
## Usage
|
||||
|
||||
@@ -26,101 +26,17 @@ Export a Plotly chart to static image formats for sharing, embedding, or printin
|
||||
|
||||
## Arguments
|
||||
|
||||
- `format` (required): Output format - one of: png, svg, pdf
|
||||
|
||||
## Examples
|
||||
|
||||
```
|
||||
/chart-export png
|
||||
/chart-export svg
|
||||
/chart-export pdf
|
||||
```
|
||||
- `format` (required): png, svg, or pdf
|
||||
|
||||
## Tool Mapping
|
||||
|
||||
This command uses the `chart_export` MCP tool:
|
||||
|
||||
```python
|
||||
chart_export(
|
||||
figure=figure_json, # Plotly figure JSON from chart_create
|
||||
format="png", # Output format: png, svg, pdf
|
||||
width=1200, # Optional: image width in pixels
|
||||
height=800, # Optional: image height in pixels
|
||||
scale=2, # Optional: resolution scale factor
|
||||
output_path=None # Optional: save to file path
|
||||
)
|
||||
chart_export(figure=figure_json, format="png", width=1200, height=800, scale=2)
|
||||
```
|
||||
|
||||
## Workflow
|
||||
|
||||
1. **User invokes**: `/chart-export png`
|
||||
2. **Agent asks**: Which chart to export? (if multiple charts in context)
|
||||
3. **Agent asks**: Image dimensions? (optional, uses chart defaults)
|
||||
4. **Agent exports**: Chart with `chart_export` tool
|
||||
5. **Agent returns**: Base64 image data or file path
|
||||
|
||||
## Output Formats
|
||||
|
||||
| Format | Best For | File Size |
|
||||
|--------|----------|-----------|
|
||||
| `png` | Web, presentations, general use | Medium |
|
||||
| `svg` | Scalable graphics, editing | Small |
|
||||
| `pdf` | Print, documents, archival | Large |
|
||||
|
||||
## Resolution Options
|
||||
|
||||
### Width & Height
|
||||
Specify exact pixel dimensions:
|
||||
```python
|
||||
chart_export(figure, format="png", width=1920, height=1080)
|
||||
```
|
||||
|
||||
### Scale Factor
|
||||
Increase resolution for high-DPI displays:
|
||||
```python
|
||||
chart_export(figure, format="png", scale=3) # 3x resolution
|
||||
```
|
||||
|
||||
Common scale values:
|
||||
- `1` - Standard resolution (72 DPI)
|
||||
- `2` - Retina/HiDPI (144 DPI)
|
||||
- `3` - Print quality (216 DPI)
|
||||
- `4` - High-quality print (288 DPI)
|
||||
|
||||
## Output Options
|
||||
|
||||
### Return as Base64
|
||||
Default behavior - returns base64-encoded image data:
|
||||
```python
|
||||
result = chart_export(figure, format="png")
|
||||
# result["image_data"] contains base64 string
|
||||
```
|
||||
|
||||
### Save to File
|
||||
Specify output path to save directly:
|
||||
```python
|
||||
chart_export(figure, format="png", output_path="/path/to/chart.png")
|
||||
# result["file_path"] contains the saved path
|
||||
```
|
||||
|
||||
## Requirements
|
||||
|
||||
This tool requires the `kaleido` package for rendering:
|
||||
```bash
|
||||
pip install kaleido
|
||||
```
|
||||
|
||||
Kaleido is a cross-platform library that renders Plotly figures without a browser.
|
||||
|
||||
## Error Handling
|
||||
|
||||
Common issues:
|
||||
- **Kaleido not installed**: Install with `pip install kaleido`
|
||||
- **Invalid figure**: Ensure figure is valid Plotly JSON
|
||||
- **Permission denied**: Check write permissions for output path
|
||||
Requires `kaleido` package: `pip install kaleido`
|
||||
|
||||
## Related Commands
|
||||
|
||||
- `/chart {type}` - Create a chart
|
||||
- `/theme {name}` - Apply theme before export
|
||||
- `/dashboard` - Create layout containing charts
|
||||
|
||||
Reference in New Issue
Block a user