16、数据可视化交互与力模拟技术详解

数据可视化交互与力模拟技术详解

1. 可视化交互基础

1.1 触摸事件交互

触摸交互可通过 touchstart 和 touchend 事件实现，同时也能以相同模式处理浏览器支持的其他触摸事件。W3C 推荐的触摸事件类型如下：
- touchstart ：用户在触摸表面放置触摸点时触发。
- touchend ：用户从触摸表面移开触摸点时触发。
- touchmove ：用户在触摸表面移动触摸点时触发。
- touchcancel ：触摸点以特定实现方式中断时触发。

1.2 缩放与平移行为实现

缩放和平移是数据可视化中常用且实用的技术，尤其适用于基于 SVG 的可视化，因为矢量图形不会像位图那样出现像素化问题。当处理大型数据集时，缩放功能特别有用，因为可能无法一次性可视化整个数据集，需要采用缩放和钻取的方法。

1.2.1 准备工作

在浏览器中打开以下文件的本地副本：

https://github.com/NickQiZhu/d3-cookbook/blob/master/src/chapter10/zoom.html

1.2.2 代码实现

<script type="text/javascript">
    var