javascript/vueecharts
1
0
Fork 0
mirror of https://github.com/ecomfe/vue-echarts.git synced 2025-10-31 00:46:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: rebrand to "Vue ECharts", improve ci.yml (#851)

Browse Source
This commit is contained in:
GU Yiling
2025-08-11 10:45:01 +08:00
committed by GitHub
parent fe7e2afd09
commit 3349c8a0eb
10 changed files with 22 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
.github/ISSUE_TEMPLATE/bug-report.en-US.yml vendored
View File

@ -1,5 +1,5 @@
name: "🐞 Bug Report" name: "🐞 Bug Report"
description: Create a bug report for Vue-ECharts description: Create a bug report for Vue ECharts
body: body:
- type: markdown - type: markdown
attributes: attributes:
@ -9,14 +9,14 @@ body:
id: confirmation id: confirmation
attributes: attributes:
label: Confirmation label: Confirmation
description: Before submitting this issue, please make sure that the problem only occurs in Vue-ECharts and is not related to ECharts itself. description: Before submitting this issue, please make sure that the problem only occurs in Vue ECharts and is not related to ECharts itself.
options: options:
- label: I can confirm this problem is not reproducible with ECharts itself. - label: I can confirm this problem is not reproducible with ECharts itself.
required: true required: true
- type: dropdown - type: dropdown
id: integration id: integration
attributes: attributes:
label: How are you introducing Vue-ECharts into your project? label: How are you introducing Vue ECharts into your project?
options: options:
- ES Module imports - ES Module imports
- "<script> tag" - "<script> tag"

6
.github/ISSUE_TEMPLATE/bug-report.zh-Hans.yml vendored
View File

@ -1,5 +1,5 @@
name: "🐞 Bug 报告" name: "🐞 Bug 报告"
description: 给 Vue-ECharts 报告 bug description: 给 Vue ECharts 报告 bug
body: body:
- type: markdown - type: markdown
attributes: attributes:
@ -9,14 +9,14 @@ body:
id: confirmation id: confirmation
attributes: attributes:
label: 请确认 label: 请确认
description: 在提交此问题前，请确认问题仅在 Vue-ECharts 中发生，而与 ECharts 本身无关。 description: 在提交此问题前，请确认问题仅在 Vue ECharts 中发生，而与 ECharts 本身无关。
options: options:
- label: 我可以确认这个问题无法在 ECharts 项目本身中复现。 - label: 我可以确认这个问题无法在 ECharts 项目本身中复现。
required: true required: true
- type: dropdown - type: dropdown
id: integration id: integration
attributes: attributes:
label: 您是如何将 Vue-ECharts 引入项目的？ label: 您是如何将 Vue ECharts 引入项目的？
options: options:
- 通过 ES 模块 import - 通过 ES 模块 import
- "<script> 标签" - "<script> 标签"

2
.github/ISSUE_TEMPLATE/feature-request.en-US.yml vendored
View File

@ -1,5 +1,5 @@
name: "✨ Feature Request" name: "✨ Feature Request"
description: Create a feature request for Vue-ECharts description: Create a feature request for Vue ECharts
body: body:
- type: markdown - type: markdown
attributes: attributes:

2
.github/ISSUE_TEMPLATE/feature-request.zh-Hans.yml vendored
View File

@ -1,5 +1,5 @@
name: "✨ 新功能建议" name: "✨ 新功能建议"
description: 给 Vue-ECharts 提交新功能建议 description: 给 Vue ECharts 提交新功能建议
body: body:
- type: markdown - type: markdown
attributes: attributes:

3
.github/workflows/ci.yml vendored
View File

@ -4,7 +4,6 @@ on:
push: push:
branches: branches:
- main - main
- "8.0" # remove this after 8.0 is merged into main
jobs: jobs:
test: test:
@ -20,7 +19,7 @@ jobs:
uses: actions/setup-node@v4 uses: actions/setup-node@v4
with: with:
node-version: 22 node-version: 22
cache: "pnpm" cache: pnpm
- name: Install dependencies - name: Install dependencies
run: pnpm install run: pnpm install

2
CHANGELOG.md
View File

@ -285,7 +285,7 @@
- Update peer dependency for `echarts` to `^5.0.2`. - Update peer dependency for `echarts` to `^5.0.2`.
- Update peer dependency for `vue` to `^2.6.11 || ^3.0.0`. - Update peer dependency for `vue` to `^2.6.11 || ^3.0.0`.
- Now `@vue/composition-api` is required to be installed to use Vue-ECharts with Vue 2. - Now `@vue/composition-api` is required to be installed to use Vue ECharts with Vue 2.
- `options` is renamed to **`option`** to align with ECharts itself. - `options` is renamed to **`option`** to align with ECharts itself.
- Updating `option` will respect **`update-options`** configs instead of checking reference change. - Updating `option` will respect **`update-options`** configs instead of checking reference change.
- `watch-shallow` is removed. Use **`manual-update`** for performance critical scenarios. - `watch-shallow` is removed. Use **`manual-update`** for performance critical scenarios.

10
README.md
View File

@ -1,4 +1,4 @@
<h1 align="center">Vue-ECharts</h1> <h1 align="center">Vue ECharts</h1>
<p align="center">Vue.js component for Apache ECharts™.</p> <p align="center">Vue.js component for Apache ECharts™.</p>
<p align="center"><a href="https://npmjs.com/package/vue-echarts"><img alt="npm version" src="https://img.shields.io/npm/v/vue-echarts"></a> <a href="https://vue-echarts.dev/"><img src="https://img.shields.io/badge/Demo%20%C2%BB-20c3aa" alt="View demo"></a> <a href="./README.zh-Hans.md"><img src="https://img.shields.io/badge/%E4%B8%AD%E6%96%87%E7%89%88%20%C2%BB-000" alt="前往中文版"></a></p> <p align="center"><a href="https://npmjs.com/package/vue-echarts"><img alt="npm version" src="https://img.shields.io/npm/v/vue-echarts"></a> <a href="https://vue-echarts.dev/"><img src="https://img.shields.io/badge/Demo%20%C2%BB-20c3aa" alt="View demo"></a> <a href="./README.zh-Hans.md"><img src="https://img.shields.io/badge/%E4%B8%AD%E6%96%87%E7%89%88%20%C2%BB-000" alt="前往中文版"></a></p>
@ -199,7 +199,7 @@ You can bind events with Vue's `v-on` directive.
> [!NOTE] > [!NOTE]
> Only the `.once` event modifier is supported as other modifiers are tightly coupled with the DOM event system. > Only the `.once` event modifier is supported as other modifiers are tightly coupled with the DOM event system.
Vue-ECharts support the following events: Vue ECharts support the following events:
- `highlight` [→](https://echarts.apache.org/en/api.html#events.highlight) - `highlight` [→](https://echarts.apache.org/en/api.html#events.highlight)
- `downplay` [→](https://echarts.apache.org/en/api.html#events.downplay) - `downplay` [→](https://echarts.apache.org/en/api.html#events.downplay)
@ -249,7 +249,7 @@ See supported events [here →](https://echarts.apache.org/en/api.html#events)
#### Native DOM Events #### Native DOM Events
As Vue-ECharts binds events to the ECharts instance by default, there is some caveat when using native DOM events. You need to prefix the event name with `native:` to bind native DOM events. As Vue ECharts binds events to the ECharts instance by default, there is some caveat when using native DOM events. You need to prefix the event name with `native:` to bind native DOM events.
```vue ```vue
<template> <template>
@ -259,7 +259,7 @@ As Vue-ECharts binds events to the ECharts instance by default, there is some ca
### Provide / Inject ### Provide / Inject
Vue-ECharts provides provide/inject API for `theme`, `init-options`, `update-options` and `loading-options` to help configuring contextual options. eg. for `theme` you can use the provide API like this: Vue ECharts provides provide/inject API for `theme`, `init-options`, `update-options` and `loading-options` to help configuring contextual options. eg. for `theme` you can use the provide API like this:
<details> <details>
<summary>Composition API</summary> <summary>Composition API</summary>
@ -337,7 +337,7 @@ export default {
### Slots ### Slots
Vue-ECharts allows you to define ECharts option's [`tooltip.formatter`](https://echarts.apache.org/en/option.html#tooltip.formatter) and [`toolbox.feature.dataView.optionToContent`](https://echarts.apache.org/en/option.html#toolbox.feature.dataView.optionToContent) callbacks via Vue slots instead of defining them in your `option` object. This simplifies custom HTMLElement rendering using familiar Vue templating. Vue ECharts allows you to define ECharts option's [`tooltip.formatter`](https://echarts.apache.org/en/option.html#tooltip.formatter) and [`toolbox.feature.dataView.optionToContent`](https://echarts.apache.org/en/option.html#toolbox.feature.dataView.optionToContent) callbacks via Vue slots instead of defining them in your `option` object. This simplifies custom HTMLElement rendering using familiar Vue templating.
**Slot Naming Convention** **Slot Naming Convention**

10
README.zh-Hans.md
View File

@ -1,4 +1,4 @@
<h1 align="center">Vue-ECharts</h1> <h1 align="center">Vue ECharts</h1>
<p align="center">Apache ECharts™ 的 Vue.js 组件。</p> <p align="center">Apache ECharts™ 的 Vue.js 组件。</p>
<p align="center"><a href="https://npmjs.com/package/vue-echarts"><img alt="npm 版本" src="https://img.shields.io/npm/v/vue-echarts"></a> <a href="https://vue-echarts.dev/"><img src="https://img.shields.io/badge/%E6%BC%94%E7%A4%BA%20%C2%BB-20c3aa" alt="查看演示"></a> <a href="./README.zh-Hans.md"></p> <p align="center"><a href="https://npmjs.com/package/vue-echarts"><img alt="npm 版本" src="https://img.shields.io/npm/v/vue-echarts"></a> <a href="https://vue-echarts.dev/"><img src="https://img.shields.io/badge/%E6%BC%94%E7%A4%BA%20%C2%BB-20c3aa" alt="查看演示"></a> <a href="./README.zh-Hans.md"></p>
@ -199,7 +199,7 @@ app.component('v-chart', VueECharts)
> [!NOTE] > [!NOTE]
> 仅支持 `.once` 修饰符，因为其它修饰符都与 DOM 事件机制强耦合。 > 仅支持 `.once` 修饰符，因为其它修饰符都与 DOM 事件机制强耦合。
Vue-ECharts 支持如下事件： Vue ECharts 支持如下事件：
- `highlight` [→](https://echarts.apache.org/zh/api.html#events.highlight) - `highlight` [→](https://echarts.apache.org/zh/api.html#events.highlight)
- `downplay` [→](https://echarts.apache.org/zh/api.html#events.downplay) - `downplay` [→](https://echarts.apache.org/zh/api.html#events.downplay)
@ -249,7 +249,7 @@ Vue-ECharts 支持如下事件：
#### 原生 DOM 事件 #### 原生 DOM 事件
由于 Vue-ECharts 默认将事件绑定到 ECharts 实例，因此在使用原生 DOM 事件时需要做一些特殊处理。你需要在事件名称前加上 `native:` 前缀来绑定原生 DOM 事件。 由于 Vue ECharts 默认将事件绑定到 ECharts 实例，因此在使用原生 DOM 事件时需要做一些特殊处理。你需要在事件名称前加上 `native:` 前缀来绑定原生 DOM 事件。
```vue ```vue
<template> <template>
@ -259,7 +259,7 @@ Vue-ECharts 支持如下事件：
### Provide / Inject ### Provide / Inject
Vue-ECharts 为 `theme`、`init-options`、`update-options` 和 `loading-options` 提供了 provide/inject API，以通过上下文配置选项。例如：可以通过如下方式来使用 provide API 为 `theme` 提供上下文配置： Vue ECharts 为 `theme`、`init-options`、`update-options` 和 `loading-options` 提供了 provide/inject API，以通过上下文配置选项。例如：可以通过如下方式来使用 provide API 为 `theme` 提供上下文配置：
<details> <details>
<summary>组合式 API</summary> <summary>组合式 API</summary>
@ -337,7 +337,7 @@ export default {
### 插槽（Slots） ### 插槽（Slots）
Vue-ECharts 允许你通过 Vue 插槽来定义 ECharts 配置中的 [`tooltip.formatter`](https://echarts.apache.org/zh/option.html#tooltip.formatter) 和 [`toolbox.feature.dataView.optionToContent`](https://echarts.apache.org/zh/option.html#toolbox.feature.dataView.optionToContent) 回调，而无需在 `option` 对象中定义它们。你可以使用熟悉的 Vue 模板语法来编写自定义提示框或数据视图中的内容。 Vue ECharts 允许你通过 Vue 插槽来定义 ECharts 配置中的 [`tooltip.formatter`](https://echarts.apache.org/zh/option.html#tooltip.formatter) 和 [`toolbox.feature.dataView.optionToContent`](https://echarts.apache.org/zh/option.html#toolbox.feature.dataView.optionToContent) 回调，而无需在 `option` 对象中定义它们。你可以使用熟悉的 Vue 模板语法来编写自定义提示框或数据视图中的内容。
**插槽命名约定** **插槽命名约定**

2
demo/Demo.vue
View File

@ -54,7 +54,7 @@ watch(codeOpen, (open) => {
<logo-chart /> <logo-chart />
<h1> <h1>
<a href="https://github.com/ecomfe/vue-echarts">Vue-ECharts</a> <a href="https://github.com/ecomfe/vue-echarts">Vue ECharts</a>
</h1> </h1>
<p class="desc"> <p class="desc">
Vue.js component for Apache ECharts™. (<a Vue.js component for Apache ECharts™. (<a

2
demo/index.html
View File

@ -9,7 +9,7 @@
href="https://fonts.googleapis.com/css?family=Inter:300,500;display=swap" href="https://fonts.googleapis.com/css?family=Inter:300,500;display=swap"
rel="stylesheet" rel="stylesheet"
/> />
<title>Vue-ECharts: Vue.js component for Apache ECharts™.</title> <title>Vue ECharts: Vue.js component for Apache ECharts™.</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>