skills.rest
openyida
openyidaOFFICIAL
Explore all skills by this author →
GitHub

yida-chart

Build ECharts dashboards on OpenYida using native report data sources.

201|43|Updated Mar 5, 2026
Search Tags:#dashboard#data-visualization#echarts#custom-page#native-reports#yida-chart
One-click install
npx skills add https://github.com/openyida/openyida --skill yida-chart
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: yida-chart
Source: https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-chart
Command: npx skills add https://github.com/openyida/openyida --skill yida-chart

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

通过将 ECharts 与自定义 JSX 页面结合，在 OpenYida 上基于原生报表构建高度定制化、可视化丰富的仪表盘，同时避免前端数据聚合。

Core Features & Use Cases

  • 使用 ECharts + 自定义页面实现高度定制化的数据可视化看板，数据源来自宜搭原生报表的 getDataAsync.json 接口。
  • 在已有原生报表的场景中，将原生报表作为数据源，或在需要时通过 yida-report 创建新的原生报表来支撑 ECharts 展示。
  • 常见用例包括柱状图、折线图、饼图、KPI 卡片等，适用于数据看板和深入数据洞察的场景。

Quick Start

使用本技能创建一个 ECharts 自定义页面，链接到一个原生报表数据源并渲染一个简单图表。

Frequently Asked Questions about yida-chart

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a custom ECharts dashboard using native report data on OpenYida?▼

To build a custom ECharts dashboard on OpenYida, you combine ECharts with custom JSX pages, pulling all data from native report endpoints like getDataAsync.json. Server-side aggregation rules handle the data, ensuring no client-side merging is needed.

Can I use ECharts to visualize data from existing native reports without frontend data aggregation?▼

Yes, you can use existing native reports as the data source for ECharts visualizations. Data must be retrieved directly from native report endpoints using server-side aggregation rules, as client-side data aggregation or data merging is strictly disallowed.

Does the ECharts dashboard skill require a specific CDN to load charting libraries?▼

Yes, ECharts must be loaded from a trusted CDN when building custom dashboard pages. This requirement ensures reliable chart rendering for bar charts, line charts, pie charts, and KPI cards without local library management.

What is the best way to create new data sources for advanced ECharts visualizations if existing native reports are insufficient?▼

The best way to create new data sources for advanced ECharts visualizations is by using the yida-report skill to generate new native reports. These reports then serve as the backend data source for your custom ECharts dashboard pages.

Why does my ECharts custom page fail to aggregate data on the client side?▼

Your ECharts custom page fails because client-side data aggregation or data merging is strictly disallowed. All data must be retrieved from native report endpoints through server-side aggregation rules to ensure data consistency and security.

What types of visualizations can I create with ECharts and custom JSX pages on OpenYida?▼

You can create highly customized visualizations including bar charts, line charts, pie charts, KPI cards, and comprehensive data dashboards. These are built atop native reports to provide advanced and beautiful data insights.

Related Skills

Explore More Software Engineering Skills→
ythmythm
1

yida-chart

Create data visualization dashboards using ECharts and Yida Platform APIs.

Community
Advanced
fusebase-devfusebase-dev
6

fusebase-portal-specific-apps

Resolve portal context automatically and filter Fusebase app data by hosting portal.

Official
Intermediate
ythmythm
1

yida-report

Automate Yida native report schema creation and ECharts data extraction.

Community
Intermediate
openyidaopenyida
201

yida-report

Generate native Yida reports with 16 built-in components via the openyida create-report command.

Official
Advanced