#charts

Create a custom PostHog-style funnel chart. Requirements: 1. Multi-step funnel (e.g., Landed -> Signed Up -> Paid). 2. Percentage drop-off calculations for each step. 3. Hover effects showing exact visitor counts. 4. Toggle to filter by cohort (e.g., 'Internal', 'External'). 5. Responsive SVG implementation using D3.js or Tremor.

Implement charts quickly with Chart.js. Chart types: 1. Line charts for trends. 2. Bar charts for comparisons. 3. Pie/Doughnut for proportions. 4. Radar for multi-axis data. 5. Scatter for correlations. 6. Mixed chart types. 7. Responsive and accessible. 8. Plugin system for customization. Use react-chartjs-2 wrapper and implement real-time updating with data push.

Craft custom visualizations with D3.js. Patterns: 1. Data binding with selection.data(). 2. Enter/update/exit pattern. 3. Scales (linear, time, ordinal). 4. Axes with d3.axis(). 5. SVG path generation. 6. Transitions for smooth updates. 7. Zoom and pan behaviors. 8. Force-directed graphs. Use Observable Plot for simpler charts or build completely custom. Integrate with React using useRef.