数据可视化中的动画支持与客户端链接技术

### 数据可视化中的动画支持与客户端链接技术 #### 1. 动画支持 在数据可视化中，动画可以为我们提供更丰富的信息展示方式。目前，`plotly.js` 中的散点图追踪类型是唯一完全支持动画的类型。 ##### 1.1 动画帧叠加 可以将动画帧叠加在所有帧的背景之上，这样能更轻松地将特定年份置于全局背景中理解。以下是实现代码示例： ```R base %>% add_markers( color = ~continent, showlegend = F, alpha = 0.2, alpha_stroke = 0.2 ) %>% add_markers(color = ~continent, frame = ~year, ids = ~country) %>% animation_opts(1000, redraw = FALSE) ``` ##### 1.2 人口金字塔图动画 对于一些特殊图表，如人口金字塔图，由于其本质是柱状图，不能直接使用 `add_bars()` 来实现动画，而需要使用基于散点的 `add_segments()` 方法。以下是美国 2018 - 2050 年按年龄和性别的人口预测动画的实现步骤： 1. 加载所需包： ```R library(idbr) library(dplyr) ``` 2. 获取数据： ```R us <- bind_rows( idb1( country = "US", year = 2018:2050, variables = c("AGE", "NAME", "POP"), sex = "male" ), idb1( country = "US", year = 2018:2050, variables = c("AGE", "NAME", "POP"), sex = "female" ) ) ``` 3. 数据处理： ```R us <- us %>% mutate( POP = if_else(SEX == 1, POP, -POP), SEX = if_else(SEX == 1, "Male", "Female") ) ``` 4. 绘制动画： ```R plot_ly(us, size = I(5), alpha = 0.5) %>% add_segments( x = ~POP, xend = 0, y = ~AGE, yend = ~AGE, frame = ~time, color = ~factor(SEX) ) ``` ##### 1.3 人口数据的折线图动画 虽然人口金字塔图很流行，但在比较不同时间的人口概况时，使用折线图可能更合适。在动画化折线时，将 `line.simplify` 设置为 `FALSE` 可以确保路径上的点数不受影响。以下是代码示例： ```R plot_ly(us, alpha = 0.5) %>% add_lines( x = ~AGE, y = ~abs(POP), frame = ~time, color = ~factor(SEX), line = list(simplify = FALSE) ) %>% layout(yaxis = list(title = "US population")) ``` #### 2. 多视图链接 链接多个数据视图是可视化和传达高维数据结构的强大方法。特别是多个 1 - 2 维统计图形的链接，常常能揭示单个视图无法展现的信息。 ##### 2.1 网页应用与客户端网页 早期的多视图链接系统虽然复杂，但生成的交互式图形不易共享、复制或整合到更大的文档中。而现代的交互式图形系统大多基于 Web 技术，需要区分网页应用和纯客户端网页： - **网页应用**：依赖客户端 - 服务器关系，当网页需要执行客户端浏览器原生不支持的计算机代码时，这种模式是必要的。但在分发网页应用时，会引入很多复杂性和计算基础设施。 - **纯客户端网页**：借助 JavaScript 和 HTML5，纯客户端网页可以在无需特殊软件依赖的情况下实现动态效果，仅需现代浏览器即可。 以下是两者的对比图： ```mermaid graph LR classDef process fill:#E5F6FF,stroke:#73A6FF,stroke-width:2px; A(Web Server running R):::process --> B(Client 1):::process A --> C(Client 2):::process B --> D(Web application):::process C --> D E(Client-side webpage):::process ``` ##### 2.2 客户端链接的图形查询 使用 `plotly` 包可以在 R 中编写代码实现完全在客户端浏览器中运行的图形查询，无需特殊的 Web 服务器或回调到 R。 ###### 2.2.1 基本图形查询 以汽车数据为例，通过 `highlight_key()` 函数为每个点分配气缸数量，当查询特定点时，所有具有相同气缸数量的点都会被高亮显示。默认情况下，鼠标点击触发查询，双击清除查询，这些事件可以通过 `highlight()` 函数自定义。以下是代码示例： ```R library(plotly) mtcars %>% highlight_key(~cyl) %>% plot_ly( x = ~wt, y = ~mpg, text = ~cyl, mode = "markers+text", textposit ```