doc: add doc for useCoarsePointer ecomfe/zrender#918

ecomfe · Sep 16, 2022 · c8cc0ac · c8cc0ac
1 parent 3bb7778
commit c8cc0ac
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 0 deletions.
diff --git a/public/api.html b/public/api.html
@@ -726,6 +726,18 @@ <h4 id="参数">参数</h4>
       <td><code class="highlighter-rouge">'auto'</code></td>
       <td>画布高度，设为 <code class="highlighter-rouge">'auto'</code> 则根据 <code class="highlighter-rouge">devicePixelRatio</code> 与容器高度自动计算。</td>
     </tr>
+    <tr>
+      <td>opts.useCoarsePointer</td>
+      <td><code class="highlighter-rouge">'auto'|boolean</code></td>
+      <td><code class="highlighter-rouge">'auto'</code></td>
+      <td>（5.4.0 版本起支持）是否扩大可点击元素的响应范围。<code class="highlighter-rouge">'auto'</code> 表示对移动设备开启；<code class="highlighter-rouge">true</code> 表示总是开启；<code class="highlighter-rouge">false</code> 表示总是不开启。</td>
+    </tr>
+    <tr>
+      <td>opts.pointerSize</td>
+      <td><code class="highlighter-rouge">number</code></td>
+      <td><code class="highlighter-rouge">44</code></td>
+      <td>扩大元素响应范围的像素大小，配合 <code class="highlighter-rouge">opts.useCoarsePointer</code> 使用。</td>
+    </tr>
   </tbody>
 </table>
 
@@ -1625,6 +1637,18 @@ <h4 id="构造函数">构造函数</h4>
       <td><code class="highlighter-rouge">-1</code></td>
       <td>是否渐进式渲染。当图形元素过多时才使用，用大于 0 的数字表示渲染顺序。</td>
     </tr>
+    <tr>
+      <td>opts.incremental</td>
+      <td><code class="highlighter-rouge">boolean</code></td>
+      <td><code class="highlighter-rouge">false</code></td>
+      <td>（5.4.0 版本起支持）是否增量式渲染。增量式渲染的意思是，在每帧渲染的时候，不擦除之前帧的该元素直接再次渲染。增量渲染的元素在单独的层中进行渲染。SVG 模式不支持。具体请参考<a href="https://github.com/ecomfe/zrender/blob/master/src/graphic/IncrementalDisplayable.ts">源码</a>。</td>
+    </tr>
+    <tr>
+      <td>opts.ignoreCoarsePointer</td>
+      <td><code class="highlighter-rouge">boolean</code></td>
+      <td><code class="highlighter-rouge">false</code></td>
+      <td>（5.4.0 版本起支持）是否忽略增加响应范围。默认情况下，在移动设备上，为了提高用户体验，可点击元素的响应范围会被扩大处理。如果某些元素不希望扩大响应范围，则应设为 <code class="highlighter-rouge">true</code>。</td>
+    </tr>
     <tr>
       <td>opts.rectHover</td>
       <td><code class="highlighter-rouge">boolean</code></td>

diff --git a/src/_api_zrender/0.init.md b/src/_api_zrender/0.init.md
@@ -15,6 +15,8 @@
 | opts.devicePixelRatio| `number`         | `2`        | 画布大小与容器大小之比，仅当 `renderer` 为 `'canvas'` 时有效。 |
 | opts.width           | `number|string` | `'auto'`   | 画布宽度，设为 `'auto'` 则根据 `devicePixelRatio` 与容器宽度自动计算。 |
 | opts.height          | `number|string` | `'auto'`   | 画布高度，设为 `'auto'` 则根据 `devicePixelRatio` 与容器高度自动计算。 |
+| opts.useCoarsePointer| `'auto'|boolean` | `'auto'`   | （5.4.0 版本起支持）是否扩大可点击元素的响应范围。`'auto'` 表示对移动设备开启；`true` 表示总是开启；`false` 表示总是不开启。 |
+| opts.pointerSize     | `number` | `44`  | （5.4.0 版本起支持）扩大元素响应范围的像素大小，配合 `opts.useCoarsePointer` 使用。 |
 
 #### 返回值
 

diff --git a/src/_api_zrender/displayable._.md b/src/_api_zrender/displayable._.md
@@ -26,6 +26,8 @@
 |opts.draggable|`boolean`|`false`|图形是否可拖曳。|
 |opts.invisible|`boolean`|`false`|图形是否不可见，为 `true` 时不绘制图形，但是仍能触发鼠标事件。|
 |opts.progressive|`number`|`-1`|是否渐进式渲染。当图形元素过多时才使用，用大于 0 的数字表示渲染顺序。|
+|opts.incremental|`boolean`|`false`|是否增量式渲染。增量式渲染的意思是，在每帧渲染的时候，不擦除之前帧的该元素直接再次渲染。增量渲染的元素在单独的层中进行渲染。SVG 模式不支持。具体请参考[源码](https://github.com/ecomfe/zrender/blob/master/src/graphic/IncrementalDisplayable.ts)。|
+|opts.ignoreCoarsePointer|`boolean`|`false`|（5.4.0 版本起支持）是否忽略增加响应范围。默认情况下，在移动设备上，为了提高用户体验，可点击元素的响应范围会被扩大处理。如果某些元素不希望扩大响应范围，则应设为 `true`。|
 |opts.rectHover|`boolean`|`false`|是否使用包围盒检验鼠标是否移动到物体。`false` 则检测元素实际的内容。|
 |opts.silent|`boolean`|`false`|是否响应鼠标事件。|
 |opts.style.fill|`string`|`'#000'`|填充样式。|