My Board

已经有 Python 和 Excel 的教程，但我们还没有看到关于 D3 的教程——而 D3 是制作网络分级统计图最简单的方法之一。使用 D3 将数据编码到网页上后，您就可以访问它并以新的方式显示它。在这个例子中，我们将制作一张 2008 年总统选举结果的地图。



让我们从基础地图开始。我们将 沙特阿拉伯数字数据 从维基百科获取美国的 .svg 文件。幸运的是，这张地图已经预先标注了每个州，因此我们可以访问并为其着色：这节省了大量时间。 否则，我们就不得不在 Illustrator 中打开我们自己的美国地图，将每个州放到自己的图层上，并用该州的缩写命名该图层。




将 .svg 文件放入新文件夹后，创建一个基本的 HTML 文件，或者下载我们提供的模板。您需要包含 jQuery 和 D3。为了达到我们的目的，您只需将 SVG 文件的内容复制并粘贴到 HTML 文件的 div 中即可。



如果您使用的是 TextMate，则只需将 SVG 拖到适当的位置即可。 图。每个 <path> 元素都是一个州，并具有映射到该州缩写的 ID 属性。“d”属性包含“M”、“L”和一堆数字，实际上包含该州的所有坐标。