Provides comprehensive guidance for uCharts chart library including chart types, data formats, chart configuration, and platform support. Use when the user asks about uCharts, needs to create charts, configure chart options, or work with uCharts in applications.
Use this skill whenever the user wants to:
This skill is organized to match the uCharts official documentation structure (https://www.ucharts.cn/v2/#/, https://www.ucharts.cn/v2/#/guide/index, https://www.ucharts.cn/v2/#/document/index). When working with uCharts:
Identify the topic from the user's request:
examples/guide/installation.mdexamples/guide/quick-start.mdexamples/charts/examples/features/api/Load the appropriate example file from the examples/ directory:
Guide (使用指南):
examples/guide/intro.md - Introduction to uChartsexamples/guide/installation.md - Installation guideexamples/guide/quick-start.md - Quick start guideexamples/guide/configuration.md - Configurationexamples/guide/platform-support.md - Platform supportCharts (图表类型):
examples/charts/line.md - Line chartexamples/charts/column.md - Column chartexamples/charts/area.md - Area chartexamples/charts/pie.md - Pie chartexamples/charts/ring.md - Ring chartexamples/charts/radar.md - Radar chartexamples/charts/funnel.md - Funnel chartexamples/charts/gauge.md - Gauge chartexamples/charts/candle.md - Candle chartexamples/charts/mix.md - Mixed chartFeatures (功能特性):
examples/features/data-format.md - Data formatexamples/features/chart-events.md - Chart eventsexamples/features/chart-methods.md - Chart methodsexamples/features/chart-update.md - Chart updateexamples/features/chart-customization.md - Chart customizationFollow the specific instructions in that example file for syntax, structure, and best practices
Important Notes:
Reference API documentation in the api/ directory when needed:
api/chart-api.md - Chart component APIapi/options-api.md - Options APIapi/data-api.md - Data APIapi/events-api.md - Events APIapi/methods-api.md - Methods APIUse templates from the templates/ directory:
templates/installation.md - Installation templatestemplates/basic-chart.md - Basic chart templatestemplates/configuration.md - Configuration templatesuCharts is a high-performance cross-platform charting library that supports uni-app, WeChat Mini Program, H5, APP and more.
Key Concepts:
Using npm:
npm install @qiun/ucharts
Using yarn:
yarn add @qiun/ucharts
Using pnpm:
pnpm add @qiun/ucharts
<template>
<qiun-data-chart type="line" :chartData="chartData" :opts="opts" />
</template>
<script>
export default {
data() {
return {
chartData: {
categories: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
series: [
{
name: 'Sales',
data: [35, 36, 31, 33, 13]
}
]
},
opts: {}
}
}
}
</script>
examples/guide/ or examples/getting-started/ → https://www.ucharts.cn/v2/#/guide/indexexamples/ → https://www.ucharts.cn/v2/#/document/indexThis skill includes detailed examples organized to match the official documentation structure. All examples are in the examples/ directory (see mapping above).
To use examples:
To use templates:
templates/ directory for common scaffoldingDetailed API documentation is available in the api/ directory, organized to match the official uCharts API documentation structure (https://www.ucharts.cn/v2/#/document/index):
api/chart-api.md)api/options-api.md)api/data-api.md)api/events-api.md)api/methods-api.md)To use API reference:
api/ directoryexamples/ directoryuCharts, @qiun/ucharts, chart, 图表, 折线图, 柱状图, 饼图, 环形图, 雷达图, 漏斗图, 仪表盘, K线图, 混合图, line chart, column chart, area chart, pie chart, ring chart, radar chart, funnel chart, gauge chart, candle chart, mixed chart, uni-app, WeChat Mini Program, H5, APP, canvas, chart options, chart data, chart events, chart methods
确保开发环境已安装必要的依赖和工具。
根据项目需求进行基础配置。
按照示例代码实现核心功能。
运行测试确保功能正常。
完成开发后进行部署和监控。