Skip to content

Commit

Permalink
fix release-note
Browse files Browse the repository at this point in the history
  • Loading branch information
plainheart committed Feb 21, 2024
1 parent 113da79 commit 80cf4ed
Show file tree
Hide file tree
Showing 3 changed files with 16 additions and 16 deletions.
14 changes: 7 additions & 7 deletions contents/en/basics/release-note/5-5-0.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ We’ve also ensured that this new feature is compatible with a variety of envir

We’re excited about this new feature and believe it will significantly improve the developer experience.

## Server-Side Rendering + Lightweight Client Runtime
## Server-Side Rendering Lightweight Client Runtime

Apache ECharts is powerful, but correspondingly, it has a large package size. We have made various efforts to improve this in previous versions. Developers can use TreeShaking to load parts of the code as needed, reducing the amount of code loaded. Starting from Apache ECharts version 5.3, we support a server-side SVG string rendering solution with zero dependencies, and support the initial animation of charts. In this way, using the result of server-side rendering as the first screen rendering can greatly reduce the first screen loading time.

Expand Down Expand Up @@ -69,7 +69,7 @@ The client adds the obtained SVG string to the container and binds the lightweig
```html
<div id="chart-container" style="width:800px;height:600px"></div>

<script src="https://cdn.jsdelivr.net/npm/echarts/ssr/client/dist/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts/ssr/client/dist/index.min.js"></script>
<script>
const ssrClient = window['echarts-ssr-client'];
Expand Down Expand Up @@ -116,13 +116,13 @@ The lightweight client runtime must be used in conjunction with the server-side
- Dynamically change data (implementation principle: the lightweight runtime requests the server for secondary rendering)
- Click the legend to toggle whether the series is displayed (implementation principle: the lightweight runtime requests the server for secondary rendering)

As you can see, this can satisfy most interactive scenario needs. If more complex interactions are needed, the client needs to load `echarts.js` to implement complete functionality. For a complete introduction, please refer to [Server-side Rendering ECharts Charts](${handbookPath}how-to/cross-platform/server).
As you can see, this can satisfy most interactive scenario needs. If more complex interactions are needed, the client needs to load `echarts.js` to implement complete functionality. For a complete introduction, please refer to [Server-side Rendering ECharts Charts](${lang}/how-to/cross-platform/server).

## Data Drilldown Supports Transition Animation

In version 5.5.0, we added the `childGroupId` configuration item, which can realize the transition animation function of data drilldown.

In previous versions, we already support using `groupId` to represent the group to which the current data belongs. The newly added `childGroupId` can be used to express the group of the current data itself, forming a "parent-child-grandchild" relationship chain after being used in conjunction with `groupId`. When the user clicks on the data element in the chart, the chart will display the drilled down data in the form of transition animation.
In previous versions, we already support using `groupId` to represent the group to which the current data belongs. The newly added `childGroupId` can be used to express the group of the current data itself, forming a \`parent-child-grandchild\` relationship chain after being used in conjunction with `groupId`. When the user clicks on the data element in the chart, the chart will display the drilled down data in the form of transition animation.

<md-example src="bar-multi-drilldown" width="100%" height="400" />

Expand Down Expand Up @@ -150,7 +150,7 @@ The ECharts [sampling](${optionPath}series-line.sampling) configuration item all

## Added Two Languages: Arabic and Dutch

In version 5.5.0, we added support for two languages, Arabic (AR) and Dutch (NL). Developers can register new language packs through the [echarts.registerLocale](~echarts.registerLocale) method.
In version 5.5.0, we added support for two languages, Arabic (AR) and Dutch (NL). Developers can register new language packs through the [echarts.registerLocale](${mainSitePath}api.html#echarts.registerLocale) method.

## Tooltip Supports Specifying Container

Expand All @@ -164,10 +164,10 @@ In version 5.5.0, we added [axisLabel.alignMinLabel](${optionPath}xAxis.axisLabe

The pictorial bar chart may exceed the drawing area. If you want to avoid this, you can clip it through the [series-pictorialBar.clip](${optionPath}series-pictorialBar.clip) configuration item.

## Tooltip `valueFormatter` Adds `dataIndex` Parameter
## Added `dataIndex` Parameter For Tooltip `valueFormatter`

`valueFormatter` can be used to customize the value part of the tooltip content, and now an `dataIndex` parameter has been added, which can be used to obtain the index of the current data.

## Full Changelog

View the [Changelog](${mainSitePath}/changelog.html#v5-5-0)
View the [Changelog](${mainSitePath}changelog.html#v5-5-0)
14 changes: 7 additions & 7 deletions contents/zh/basics/release-note/5-5-0.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@

我们非常期待这一新功能,并相信它将极大地改善开发者的体验。

## 服务端渲染 + 客户端轻量运行时
## 服务端渲染 客户端轻量运行时

Apache ECharts 功能强大,相应地,包体积也比较大。我们在之前的版本中也做了各种努力来改进这一点。开发者可以使用 TreeShaking 按需加载部分代码,以减少加载的代码量。从 Apache ECharts 5.3 版本起,我们支持了零依赖的服务端 SVG 字符串渲染方案,并支持图表的初始动画。这样,使用服务端渲染的结果作为首屏渲染的画面,可以大大减少首屏加载时间。

Expand Down Expand Up @@ -69,7 +69,7 @@ res.end();
```html
<div id="chart-container" style="width:800px;height:600px"></div>

<script src="https://cdn.jsdelivr.net/npm/echarts/ssr/client/dist/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts/ssr/client/dist/index.min.js"></script>
<script>
const ssrClient = window['echarts-ssr-client'];
Expand Down Expand Up @@ -116,7 +116,7 @@ fetch('...')
- 动态改变数据(实现原理:轻量运行时请求服务器进行二次渲染)
- 点击图例切换系列是否显示(实现原理:轻量运行时请求服务器进行二次渲染)

可以发现,这能够满足大部分的交互场景需求。如果需要更复杂的交互,则客户端需要加载 `echarts.js` 实现完整功能。完整的介绍请参见[服务端渲染 ECharts 图表](${handbookPath}how-to/cross-platform/server)
可以发现,这能够满足大部分的交互场景需求。如果需要更复杂的交互,则客户端需要加载 `echarts.js` 实现完整功能。完整的介绍请参见[服务端渲染 ECharts 图表](${lang}/how-to/cross-platform/server)

## 数据下钻支持过渡动画

Expand Down Expand Up @@ -150,11 +150,11 @@ ECharts 的 [sampling](${optionPath}series-line.sampling) 配置项允许设置

## 新增两种语言:阿拉伯语和荷兰语

在 5.5.0 版本中,我们新增了阿拉伯语(AR)和荷兰语(NL)两种语言的支持。开发者可以通过 [echarts.registerLocale](~echarts.registerLocale) 方法注册新的语言包。
在 5.5.0 版本中,我们新增了阿拉伯语(AR)和荷兰语(NL)两种语言的支持。开发者可以通过 [echarts.registerLocale](${mainSitePath}api.html#echarts.registerLocale) 方法注册新的语言包。

## 提示框支持指定容器

在之前的版本中,提示框(Tooltip)只能插入到图表容器或者 `document.body` 中。现在,可以通过 [tooltip.appendTo](${optionPath}tooltip.appendTo)指定容器,从而能更灵活地控制提示框的位置。
在之前的版本中,提示框(Tooltip)只能插入到图表容器或者 `document.body` 中。现在,可以通过 [tooltip.appendTo](${optionPath}tooltip.appendTo) 指定容器,从而能更灵活地控制提示框的位置。

## 坐标轴最大、最小标签的对齐方式

Expand All @@ -166,10 +166,10 @@ ECharts 的 [sampling](${optionPath}series-line.sampling) 配置项允许设置

象形柱图可能存在超过绘图区域的情况,如果希望避免这种情况,可以通过 [series-pictorialBar.clip](${optionPath}series-pictorialBar.clip) 配置项进行裁剪。

## 提示框 `valueFormatter` 增加 `dataIndex` 参数
## 提示框 valueFormatter 增加 dataIndex 参数

`valueFormatter` 可以用来自定义提示框内容中数值的部分,现在新增了 `dataIndex` 参数,可以用来获取当前数据的索引。

## 完整更新记录

查看[版本更新](${mainSitePath}/changelog.html#v5-5-0)
查看[版本更新](${mainSitePath}changelog.html#v5-5-0)
4 changes: 2 additions & 2 deletions pages/_.vue
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ function slugify(s: string) {
String(s)
.trim()
.toLowerCase()
.replace(/\s+/g, '-')
.replace(/[\s+:]/g, '-')
)
}
Expand Down Expand Up @@ -175,7 +175,7 @@ export default {
linkify: true
})
.use(anchor, {
// slugify,
slugify,
permalink: false,
permalinkAfter: true,
permalinkSymbol: '#',
Expand Down

0 comments on commit 80cf4ed

Please sign in to comment.