数据可视化基础与Processing实践

### 数据可视化基础与Processing实践 #### 1. 数据可视化起步要点 在进行科学可视化时，快速尝试的能力比复杂的代码结构更为重要。在开始使用Processing进行数据可视化时，有以下要点需要考虑： - **避免创建不必要的代码结构**：将代码封装到类中时，不要过度细分。例如，不需要为分子、原子或夸克级别创建类，要根据实际需求确定抽象层次。 - **考虑项目规模**：不必一开始就构建企业级软件，应找出能帮助回答问题的最少代码量。 - **是否需要使用数据库**：如果处理的数据量较小且内存足够，可以直接将数据加载到内存中操作，避免在不明确数据用途时设计数据库架构。 - **是否需要使用全量数据**：收集了大量数据后，首轮问题可能不需要全部数据，少量数据通常就足以判断大型项目是否值得开展。 在合适的时机再进行工程化工作，可视化软件的工程化起点比传统编程项目要晚，因为早期的快速迭代有其独特的“艺术”。一旦代码能正常工作，除非是为了解决全新问题，否则不要轻易重写，可进行重构来优化方法名和类交互。 #### 2. 使用Processing绘制地图 以下是使用Processing绘制美国地图的具体步骤： 1. **创建新草图**：在Processing中，选择“File ➝ New”来创建一个新的草图。 2. **下载并添加地图文件**：从“http://benfry.com/writing/map/map.png”下载美国地图文件“map.png”，然后将其拖放到Processing编辑器窗口，底部会出现确认文件已添加到草图的消息，也可以通过“Sketch ➝Add File”添加文件。草图以文件夹形式组织，所有数据文件都放在名为“data”的子文件夹中。 3. **编写代码**：输入以下代码： ```java PImage mapImage; void setup( ) { size(640, 400); mapImage = loadImage("map.png"); } void draw( ) { background(255); image(mapImage, 0, 0); } ``` 4. **运行代码**：点击“Run”按钮，若代码输入正确，新窗口将显示美国地图。 Processing的API函数命名直观，`setup()`方法在点击“Run”后执行一次，用于加载图像、字体和设置变量初始值；`draw()`方法以每秒60帧的速度重复运行，可用于更新屏幕显示动画或响应鼠标移动等输入。`loadImage()`函数从数据文件夹读取图像，`PImage`类用于存储图像数据，`image()`函数将图像绘制到屏幕指定位置。 #### 3. 指定地图上的位置 接下来要在地图上指定一些点，具体步骤如下： 1. **下载位置数据文件**：从“http://benfry.com/writing/map/locations.tsv”下载包含每个州中心坐标的文件。 2. **下载读取数据的代码**：从“http://benfry.com/writing/map/Table.pde”下载读取位置数据文件的代码，并将这两个文件添加到草图中。 3. **使用`Table`类读取数据**：`Table`类可将文件读取为行列网格，通过`table.getFloat(row, column)`方法获取浮点值，行列编号从0开始。 4. **修改代码显示州中心**：修改后的代码如下： ```java PImage mapImage; Table locationTable; int rowCount; void setup( ) { size(640, 400); mapImage = loadImage("map.png"); locationTable = new Table("locations.tsv"); rowCount = locationTable.getRowCount( ); } void draw( ) { background(255); image(mapImage, 0, 0); smooth( ); fill(192, 0, 0); noStroke( ); for (int row = 0; row < rowCount; row++) { float x = locationTable.getFloat(row, 1); float y = locationTable.getFloat(row, 2); ellipse(x, y, 9, 9); } } ``` `smooth()`、`fill()`和`noStroke()`函数影响后续绘图，`fill()`函数用于设置颜色，这里将所有圆设置为红色。 #### 4. 在地图上显示数据 要在地图上加载一组数据值，操作步骤如下： 1. **下载数据文件**：从“http://benfry.com/writing/map/random.tsv”下载数据文件，并添加到草图中。 2. **找出数据的最小值和最大值**：使用以下代码： ```java PImage mapImage; Table locationTable; int r ```