showtime-echarts

Reusable Vue 3 chart components powered by ECharts 6 and Vue ECharts 8.

Install

pnpm add showtime-echarts echarts vue-echarts

Use

<script setup lang="ts">
import { ShowtimeCartesianChart } from 'showtime-echarts'
import 'showtime-echarts/style.css'

const categories = ['Jan', 'Feb', 'Mar']
const series = [
  { name: 'Visits', type: 'bar', color: '#2563eb', data: [120, 156, 188] },
  { name: 'Rate', type: 'line', color: '#0f9f8f', data: [12, 15, 18], yAxisIndex: 1, smooth: true }
]
</script>

<template>
  <ShowtimeCartesianChart
    :categories="categories"
    :series="series"
    :y-axis="[{ type: 'value' }, { type: 'value' }]"
    height="320px"
  />
</template>

The package exports:

• ShowtimeCartesianChart
• ShowtimeDonutChart
• ShowtimeBubbleChart

vue, echarts, and vue-echarts are peer dependencies. showtime-echarts does not depend on showtime-components.