跳至主要内容

利用Rhino+GH+AI的数据可视化表现

原文来自韩世麟博客，表示感谢，感谢作者可可

使用软件：Rhinoceros, Grasshopper, Illustrator
编者按：可可这次又带来神级教程，可以说完美的解决了一大类图解的绘制思路问题。我经常被问到类似文中的数据可视化图解“是怎么画的”这类问题，无奈对于数据处理方面，我知之甚少。相信今天的这一篇文章能够为大家解惑。
作者简介
张可天
张可天是2015年毕业于天津大学的建筑学硕士。目前就职于天津市设计院。他专长建筑方案设计及表现，基本功扎实，而且他也一直乐于分享他总结到的技巧，曾经在人人网上接连发表过多篇图文教程：《可可这样画》系列。同时他也是专筑网《SketchUp极速出图八讲》的主讲人。

这是一篇我在知乎的回答（点击这里查看张可天的知乎答案），题主提出的参考原图如下，希望能够得知这张图的画法。
我尝试用Rhino+Grasshopper画图并导入AI修饰，步骤如下：
1.取得数据
样例中的图应该是有数据来源的，可能是作者调研或文献摘录的。我并没有这些数据，所以我把原图中的数据大概加估计地逆向回来。数据的存在形式有很多种，我使用了比较常见的一种，将数据放在一张EXCEL表格的两个SHEET中，如下图。

Sheet1是一张映射关系图，是样例图中从右上方到左下方的那些个映射曲线数据。excel中，横轴是“人口分布(Population Distribution)”中的各类人，纵轴是“元素时间表(Element Timeline)”中的那些“元素(Element)”，“0”代表着没有映射关系，“1”代表著有映射关系。

Sheet2是一张时间数据图，是样例图中右下的那张大表格的数据。excel中，横轴是样例图的“时间点”，纵轴是“元素(Element)”，其中的数据根据原图中的意思，应该是某个“元素(Element)”在“工作日/休息日（Workday/Weekend）”时，特定的“时间点”上所接待或容纳的人数。我并没有看出来样例图中该数据的单位，所以我臆测了一下。我以垂直方向一格代表“10人”为单位，读取了这些数据，得到上表。
2.导入Rhino
我使用Grasshopper中的Bumble Bee将Excel数据导进来，这个插件是我能够找到的导入Excel表格效率最高的一个插件了，并且好处是他可以导入一个文件中的不同的SHEET，非常方便。下图中的Panel中，你可以看到，Excel数据被完整的导入进来了~
3.建立第一部分——映射曲线
先不要急着建立曲线，我们需要先知道这些曲线画在哪里。我先在Rhino的顶视图（Top View）中，模拟样例图中的位置，建立了各个曲线的起点和终点位置，并将它们拾取到GH中。务必注意拾取的顺序，防止出错。如下图：
之后我用了一些数据变换来让映射数据转换为点和点的对应数据，并把它们用Besier Span运算器连接起来。特别需要注意的是，使用大小相同的X向量作为Besier Span运算器中各映射点间的连接线的切向向量容易造成曲线区分度太低，所以使用了下图中橘色虚线部分的做法，按照连接线两侧映射点的高低位置不同，赋予不同的X向量大小，增加了曲线的区分度。（我发现原图应该是手动绘制的，即使按照我这样区分依然很难辨识曲线关系。。。水平有限请谅解）
结果是这样的：（-_-!!!）
4.建立第二部分——时间表
下面我处理了时间表数据，我首先将下图中橘色虚线框中的点沿X轴复制，得到了每行24个用于对应时间数据的点。然后我把Excel导入的数据做了一系列的数据变换先将数据分好组，然后将他们的值依次赋给上述相应位置上的点的Y坐标值，这些点就有高低变化了。需要特别注意的，我反复观察了样例图，发现原图为了让时间表中的曲线看起来不会太细，时间表数据中没有“0”这么小的数据（防止时间表中的线过细），因此我将最小的数据控制在0.5。这些点的结果如下图：
接下来我把他们连了起来，我尝试了几种连接方法，最后选择Blend Curve运算器，这样绘出的曲线，数据比较准确，图形连接也比较平滑。如下图：
5.建立第三部分——元素工作日/休息日图例
这一部分相对容易了，点的位置我已经画好了，只需要用合适的运算器将他们分好组连接起来就可以了~~
6.烘焙曲线并导出到AI中
把曲线分好组烘焙出来，我还顺手画上了时间表的网格，省着到AI里画了~
我是在rhino里分别导出成ai文件，然后到ai里粘贴到一个文件的~~就酱~
然后先把时间表的网格改一改
我先把周围这些零碎东西画上了，一个是可以把构图确定下来，二一个可以把画好的图例元素当做图形样式直接应用到其他曲线上，提高效率。如下图：
剩下的就是慢慢画，调整线型、填充、透明度等等步骤了。良好的图层、组、图形样式、色板的设置会帮你提高不少绘图效率的~最后，我调整了一下构图以及左下部分曲线的构型，让他们不会过粗或者过细。
人物图标懒得搞了，最终效果就酱：

跟原图比还是有很多不足的，需要慢慢调整修正~~希望能帮到大家。
源文件贴上来，点击这里下载 密码：vsts
张可天
2015.12.08
标签：

Popular posts from 产品随想的博客

Steve Jobs at 44, By Michael Krantz, 1999

Differences and Similarities Between Apple and Pixar Apple turns out many products--a dozen a year; if you count all the minor ones, probably a hundred. Pixar is striving to turn out one a year. But the converse of that is that Pixar's products will still be used fifty years from now, whereas I don't think you'll be using any product Apple brings to market this year fifty years from now. Pixar is making art for the ages. Kids will be watching Toy Story in the future. And Apple is much more of a constant race to continually improve things and stay ahead of the competition.  His Role At Pixar At Pixar my job is to help build the studio and recruit people and help create a situation where they can do the best work of their lives. And to some degree it's the same at Apple. But at Pixar, I don't direct the movies, whereas at Apple probably, if I had to pick a role out of a film production, I'd be the director. So it...
阅读全文

Foobar2000 组件安装教程

 原作者 博客地址   汉化作者 Asion博客   关于foobar 2000的一些资源 前言 foobar2000 由于其软件架构特点以及开放的姿态，使得第三方很容易开发组件（component）来拓展它的功能。由于在官网下载的默认安装文件只带了少量几个默认的组件，满足不了使用的需求，例如：默认不带 ape，tta，tak 等音频文件格式的解码器，很多无损压缩格式音乐没法播放。所以自己下载安装组件是必备的基本技能。 foobar2000 的中文汉化版（Asion 汉化）为了方便使用，集成了无损压缩文件解码器以及一些其它有用的插件，安装时选上即可，不喜欢折腾的建议使用汉化版。 这里组件指的是 foobar2000 标准组件（*.dll 文件），而非 vst 插件等其它插件，姑且把组件分为两类： 官方组件： 英文版安装包自带，安装时可选择； 第三方组件：非官方自带的组件 除了 foo_input_std.dll 和 foo_ui_std.dll 这两个组件是必须的外，其它的所有组件都 非必需 的，可以随需要增删。第三方组件可以去 官网 、 官方论坛 或者 官方 wiki 去找，也可以去贴吧等地逛逛。 下载 还是要强调一下，这里说的是 foobar2000 component ，不是中文网上通常说的 vst 插件。 下载好的组件包一般是 xxx.zip 或 xxx.fb2k-component 格式的文件，也有用 7z 打包的。前两种都是 zip 压缩（只要把 fb2k-component 改成 zip 文件就变成了 zip： 包）。标准状况下压缩包里的内容结构应该是 xxx.zip yyy.dll README.txt (可能没有) LICENCE.txt (可能没有) (其它杂七杂八） 除少数外一般只有一个 xxx.dll 文件.一定要注意压缩包结构不能是: xxx.zip yy folder (文件夹） zzz.dll … 否则要解压缩，提取那个 dll 文件。 安装 方法一（推荐） 打开 foobar2000 的菜单 文件 > 首选项(file >preferences) 的 组件(components...
阅读全文

A Sister’s Eulogy for Steve Jobs

I grew up as an only child, with a single mother. Because we were poor and because I knew my father had emigrated from Syria, I imagined he looked like Omar Sharif. I hoped he would be rich and kind and would come into our lives (and our not yet furnished apartment) and help us. Later, after I’d met my father, I tried to believe he’d changed his number and left no forwarding address because he was an idealistic revolutionary, plotting a new world for the Arab people. Even as a feminist, my whole life I’d been waiting for a man to love, who could love me. For decades, I’d thought that man would be my father. When I was 25, I met that man and he was my brother. By then, I lived in New York, where I was trying to write my first novel. I had a job at a small magazine in an office the size of a closet, with three other aspiring writers. When one day a lawyer called me — me, the middle-class girl from California who hassled the boss to buy us health insurance — and said his cl...
阅读全文

Steve Jobs: `There's Sanity Returning', 1998

Nobody can doubt the charisma of Steven P. Jobs. The interim CEO of Apple Computer Inc., who returned to the company last July after his ignominious 1985 ouster, has brought back his legendary vision, impatience, and infectious passion for the Macintosh. Jobs spoke to Business Week Correspondent Andy Reinhardt in Apple's stark, fourth-floor boardroom, just after the company rolled out its new software strategy on May 11. Note: This is an extended, online-only version of the Q&A that appears in the May 25, 1998, issue of Business Week. Q: Now that you've introduced the new, bold-looking iMac, are you going to do some radically different products? A: There's a lot of talk about such things -- about handhelds, set-top boxes. A lot of computer companies have been searching for a consumer product. My view is that the personal computer has been the most successful consumer product of the last 10 years. What we have to do, what the industry stopp...
阅读全文

360T7 刷机步骤及固件

https://cmi.hanwckf.top/p/360t7-firmware/   360T7的固件支持由immortalwrt-mt798x项目提供支持，请参考： https://cmi.hanwckf.top/p/immortalwrt-mt798x https://github.com/hanwckf/immortalwrt-mt798x 刷机步骤 参考 此处 的办法开启原厂固件的UART和telnet功能 在以下链接下载360T7测试固件（纯净版，无任何插件） https://wwd.lanzout.com/b0bt9idwd 密码:ezex （此固件已过时，请选择其它更新的固件） 接下来将刷入修改版uboot。修改版uboot的优点有： 固件分区可达108MB，原厂uboot只能使用36M 自带一个简单的webui恢复页面 到以下仓库的Release页面下载uboot，目前暂时仅支持360T7，后续将支持更多mt798x路由器。 推荐使用 mt7981_360t7-fip-fixed-parts.bin ， fixed-parts 代表uboot分区表在编译期间固定，不会随着uboot环境变量变化。 https://github.com/hanwckf/bl-mt798x/releases/latest 将 mt7981_360t7-fip-fixed-parts.bin 通过HFS等方式上传到路由器，使用以下命令刷入uboot mtd write mt7981_360t7-fip-fixed-parts.bin fip 确认刷入完毕后，拔掉路由器电源。然后将电脑的IP地址设置为固定的 192.168.1.2 ，接着按住路由器的RESET按钮后通电开机，等待8s后用浏览器进入 192.168.1.1 在uboot恢复页面选择要刷入的固件。immortalwrt-mt798x目前编译两个版本的360T7固件。 建议修改版uboot直接使用 immortalwrt-mediatek-mt7981-mt7981-360-t7-108M-squashfs-factory.bin ，两种固件区别如下： mt7981-360-t7-108M 为108M固件分区，原厂uboot不可启动，需要修改版u...
阅读全文

Steve Jobs talks about the difference between art and technology

  When asked by   Time   magazine about the difference between art and technology, Jobs said, “I’ve never believed that they’re separate. Leonardo da Vinci was a great artist and a great scientist. Michelangelo knew a tremendous amount about how to cut stone at the quarry. The finest dozen computer scientists I know are all musicians. Some are better than others, but they all consider that an important part of their life. I don’t believe that the best people in any of these fields see themselves as one branch of a forked tree. I just don’t see that. People bring these things together a lot. Dr. Land at Polaroid said, ‘I want Polaroid to stand at the intersection of art and science,’ and I’ve never forgotten that. I think that that’s possible, and I think a lot of people have tried.”
阅读全文

产品随想 | 周刊 第115期：2024.5.16 Great libraries build communities

Loop   https://github.com/MrKai77/Loop Loop is a macOS app that simplifies window management for you! 我的电视 my-tv   https://github.com/lizongying/my-tv 我的电视 电视直播软件，安装即可使用 When we think about this technology, we need to put human dignity, human well-being—human jobs—in the center of consideration. ————Fei-Fei Li Author Talks: Dr. Fei-Fei Li sees ‘worlds’ of possibilities in a multidisciplinary approach to AI   https://www.mckinsey.com/featured-insights/mckinsey-on-books/author-talks-dr-fei-fei-li-sees-worlds-of-possibilities-in-a-multidisciplinary-approach-to-ai Randy Ubillos   https://apple.fandom.com/wiki/Randy_Ubillos Randall Hayes "Randy" Ubillos is the original software engineer behind Adobe Premiere and Final Cut Pro. 影响全球视频制作的男人， Reminders MenuBar   https://github.com/DamascenoRafael/reminders-menubar Simple macOS menu bar application to view and interact with reminders. Developed with SwiftUI and using Apple Reminders as a source. Bad libraries build colle...
阅读全文

ISSUU使用指南--木喵

作者： 木喵   出处： Wonderworks 问：issuu是什么？ 答：Issuu是国外的一个在线文档共享网站，它是你的PDF文档发布专家。它类似于我们熟悉的youtube，但它共享的是文档、杂志之类的文本。 简而言之、同志们想看国外的各种杂志？ 想找国外的汇报文本么？ 想借鉴国外学生的作品集么？ 那么你就要用到它啦~ 今天主要和大家讲两个方面 一、如何在pc端使用和下载issuu上的pdf文档 首先我们打开issuu的网址 https://issuu.com/ 我们可以很清楚的看到网页上呢都是国外的杂志以及一些作者自己制作的pdf文档 首先我们点击右上角的 sign up  然后填写相关信息注册一个账户： 注册完成之后我们就可以搜索我们想要找的资料： 比如说，我想找一些分析图的资料，我们就搜索： architecture diagram 然后我们就可以看到相关的文档了： 点击你所选择的文档， 好了问题来了： sorry，this publication is not available 这个时候！就需要在用pc端的我们做一件必不可少的事： 翻墙 然后我们就能将页面刷新粗来了 好、接下来是非常有建设性意义的一步 怎样把我们网页上的文件 下载下来 呢？ 截图？ no~no~no~ 接下来，让木喵告诉你怎么下载： 首先你需要复制上面的网址 然后将 https://wenfan.hk/issuu/index_link.php 在另一个网址中打开 将你之前复制的pdf的网址粘贴在下面的对话框中 点击 I‘m not a robot 再点击 get it 然后会出现一堆网址代码 我们 全选 打开你的迅雷点击 新建 将你之前的复制粘贴到下载链接里 然后呢~我们就全都下载成功啦~ 然后我们回到之前的网页向下看 我们可以看到有上传文档的作者（记得要关注哟） 然后还有 info   share   stack   ❤ 如果...
阅读全文

2018各行业应届生薪资不完全样本往期汇总-职场红领巾

文章来源自职场红领巾公众号2018.4.21日推送，在此表示感谢 产品岗 百度商业产品 14K*14 拼多多产品管培 12K*14 今日头条产品 16K*18 头条PM整个Package接近300K/年 美团产品Offer 14K*16 base上海 百度产品研究生 11.5K*14.6 base 上海 京东产品17K*13 百度产品 220K/年 网易 产品培训生 硕士 15K*18 SP base杭州 不知名互联网公司校招PM 12K*15 base北京 技术岗 微软 软件工程师 本科 260K/年 蚂蚁金服算法工程师 20K*16 拼多多开发本科400K/年 商汤科技本科技术岗 14K/月 税前 海康威视研究院 算法工程师 220K/年 微信算法岗 SP 360K/年 的package 今日头条 程序员 研究生 10K/月 base北京 滴滴程序员 16K*16 亚马逊 小四年经验 研发 50K/月 Facebook应届毕业生  软件开发工程师   打包 115k$/年（30%-40%税） base湾区 京东算法 普通Offer 234K/年 运营岗 滴滴北京运营岗 硕士 12K*15 奖金另算 网易游戏运营 150K/年 左右 网易运营 8K*13（奖金0~3个月） 网易新闻运营8K/月 腾讯游戏运营 本科6K/月 上海京东时尚本科8K/月 京东运营岗 11K/月 base北京亦庄总部 今日头条 渠道营销运营 6K/月（加房补） 网易考拉 活动运营 13K*16 OFO城市运营管培13K*14 爱范儿运营 8K/月 滴滴长三角某二线城市运营管培生 薪资 7.6K*13 +每个月40%绩效 货车帮 数据运营 12K/月 卡宾电商 管培 10K/月 含浮动绩效 曹操专车 运营管培生  加各种补贴税前5.4K/月  base杭州 京东金融海龟回来8K/月 北京蓝港互动...
阅读全文

《Becoming Steve Jobs》Chapter 16 Blind Spots, Grudges, and Sharp Elbows

Steve could be pretty thin-skinned when someone prominent criticized the aesthetics of his products. He took great umbrage that Neil would, as Steve put it, “pop off in public like that without coming to talk to us about his technical concerns first.” From that point on he had rebuffed all of Neil’s attempts to smoke the peace pipe. 有趣 He had blind spots, grating behavioral habits, and a tendency to give in to emotional impulse that persisted his entire life. These characteristics are often used to make the case that Steve was an “asshole” or a “jerk,” or perhaps simply “binary”—that odd adjective often used to convey the sense that he was half asshole/half genius from birth to death. These aren’t useful, interesting, or enlightening descriptions. What’s more illuminating is to take a look at the specific ways in which Steve failed to do an effective job of tempering some of his weaknesses and antisocial traits, and to consider how, when, and why some of them continued to flare up even...
阅读全文