This is an automated email from the ASF dual-hosted git repository. Justin-ZS pushed a commit to branch codex/docs-resize-dpr in repository https://gitbox.apache.org/repos/asf/echarts-doc.git
commit d195c6860d4e2c019f78429512c05e1506a8c6d8 Author: Justin-ZS <[email protected]> AuthorDate: Thu May 28 16:07:30 2026 +0800 docs(api): document resize devicePixelRatio --- en/api/echarts-instance.md | 5 +++++ zh/api/echarts-instance.md | 4 ++++ 2 files changed, 9 insertions(+) diff --git a/en/api/echarts-instance.md b/en/api/echarts-instance.md index 02accb76..bc4e0dd7 100644 --- a/en/api/echarts-instance.md +++ b/en/api/echarts-instance.md @@ -307,6 +307,7 @@ chart1.setTheme('dark'); (opts?: { width?: number|string, height?: number|string, + devicePixelRatio?: number, silent?: boolean, animation?: { duration?: number @@ -326,6 +327,8 @@ Resizes chart, which should be called manually when container size changes. + `height` Specify height explicitly, in pixel. If setting to `null`/`undefined`/`'auto'`, height of `dom` (instance container) will be used. + + `devicePixelRatio` Specify device pixel ratio explicitly. If not specified, the current value of browser's `window.devicePixelRatio` will be used. + + `silent` Specify whether or not to prevent triggering events. + `animation` Whether to apply transition animation when resize, including `duration` and `easing`, the default `duration` is 0, that is, no transition animation is applied. @@ -334,6 +337,8 @@ Resizes chart, which should be called manually when container size changes. Sometimes charts may be placed in multiple tabs. Those in hidden labels may fail to initialize due to the ignorance of container width and height. So `resize` should be called manually to get the correct width and height when switching to the corresponding tabs, or specify width/height in `opts` explicitly. +When the browser zoom level changes, calling `resize` will update the chart with the current `window.devicePixelRatio` by default, which helps avoid blurry rendering. + ## renderToSVGString(Function) {{ use: partial-version(version = "5.3.0") }} diff --git a/zh/api/echarts-instance.md b/zh/api/echarts-instance.md index af640b24..27b39db5 100644 --- a/zh/api/echarts-instance.md +++ b/zh/api/echarts-instance.md @@ -307,6 +307,7 @@ chart1.setTheme('dark'); (opts?: { width?: number|string, height?: number|string, + devicePixelRatio?: number, silent?: boolean, animation?: { duration?: number @@ -324,11 +325,14 @@ chart1.setTheme('dark'); + `width` 可显式指定实例宽度，单位为像素。如果传入值为 `null`/`undefined`/`'auto'`，则表示自动取 `dom`（实例容器）的宽度。 + `height` 可显式指定实例高度，单位为像素。如果传入值为 `null`/`undefined`/`'auto'`，则表示自动取 `dom`（实例容器）的高度。 + + `devicePixelRatio` 可显式指定设备像素比。如果未指定，则默认使用浏览器当前的 `window.devicePixelRatio`。 + `silent` 是否禁止抛出事件。默认为 `false`。 + `animation` resize 的时候是否应用过渡动画，包含时长`duration`和缓动`easing`两个配置，默认`duration`为 0，即不应用过渡动画。 **Tip:** 有时候图表会放在多个标签页里，那些初始隐藏的标签在初始化图表的时候因为获取不到容器的实际高宽，可能会绘制失败，因此在切换到该标签页时需要手动调用 `resize` 方法获取正确的高宽并且刷新画布，或者在 `opts` 中显示指定图表高宽。 +浏览器缩放比例发生变化后，调用 `resize` 默认会使用当前的 `window.devicePixelRatio` 更新图表，可避免缩放后图表渲染模糊。 + ## renderToSVGString(Function) {{ use: partial-version(version = "5.3.0") }} --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
