Skills
.Work. You
Rest

dual-chart

Community

Combine bars and lines in a single chart.

Data & Analytics#dashboard#Vue#charting#data-visualization#visualize#DualChart
Authordennisadriaans
Version1.0.0
Installs0

System Documentation

What problem does it solve?

DualChart enables combining bar and line charts to compare two related metrics in a single visualization, helping users quickly spot correlations and divergences.

Core Features & Use Cases

  • Bar + Line integration: Merge bar series and line series in one chart for side-by-side comparison.
  • Config-driven: Define barYAxis, lineYAxis, barCategories, and lineCategories to map data keys to visuals.
  • Use Case: Analyze monthly revenue (bars) alongside profit margin (line) to identify trends and opportunities.

Quick Start

Install the vue-chrts library in your project and import the DualChart component. Provide a dataset with at least two bar metrics and one line metric. Bind barCategories, barYAxis, lineCategories, and lineYAxis to the DualChart to render the combined visualization.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 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: dual-chart
Download link: https://github.com/dennisadriaans/vue-chrts/archive/main.zip#dual-chart

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

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.