---
name: "echarts-enterprise-data-dashboard"
description: "Render complex multi-dimensional enterprise charts and maps with Apache ECharts."
metadata:
  author: "Apache"
  version: "1.0.0"
  runtime_compatibility:
    - "codex"
    - "claude-code"
    - "cursor"
    - "windsurf"
triggers:
  - "create candlestick chart echarts"
  - "add datazoom slider echarts"
  - "switch echarts to svg renderer"
permissions:
  fs_read: true
  fs_write: "workspace"
  shell_exec: false
  net_access: false
---

# Apache ECharts Enterprise Visualizations

Builds enterprise dashboards with Apache ECharts: heatmaps, candlestick financial charts, sunburst hierarchies, large dataset dataZoom sliders, and Canvas/SVG dual renderers.

## When to Invoke
Invoke this skill whenever you need to:
- create candlestick chart echarts
- add datazoom slider echarts
- switch echarts to svg renderer

## Execution SOP & Rules
1. Initialize instances with echarts.init(dom, null, { renderer: 'canvas' }).
2. Define complete configuration objects and apply via chartInstance.setOption(option).
3. Enable dataZoom components: [{ type: 'slider', start: 0, end: 100 }] for large time-series data.
4. Attach window resize listener to trigger chartInstance.resize() on layout changes.

## Verification Checklist
- Run local linting, syntax validation, and type-checks before reporting completion.
- Ensure all created or modified files adhere to workspace boundaries and avoid uncommitted secrets.
- Verify tests or build commands exit cleanly with return code 0.
