X.d 笔记

上次说，准备用不到40小时的时间开发一个移动版本！

结果发现用微信小程序和前端一样容易，用时应该不到10小时(写代码比写博客容易太多太多！)，功能还很粗糙，欢迎扫码体验：

主要特点：

1. 体积很小，不到 0.5MB，且一次打开，次次秒开，离线也可打开。
2. 没有任何数据交互，无任何注册登录，不收集任何数据。
3. 可以分享给其它人哟，分享的是啥，点开的就是啥。

今天先上点干货，说下可视化的一些理论。

顺路再次说明下：可视化相关的博客，我会同时更新到

• https://www.xdnote.com/ : 我的个人博客
• https://vis.zone/blog/ : 数据可视化专区

本文的地址是 https://vis.zone/blog/data-vis-theory/ , 如果你在xdnote.com, 建议去 vis.zone 阅读，使用的是 Next皮肤，阅读体验好些！

可视化学科

最近一两年，已经少量院校新开设了《数据可视化》这一课程，教授的主要内容有：

• 可视化的思想理论与整体样貌
• 可视化的历史现状及未来展望
• 可视化的应用原则、各种基础元件、通道等。
• 各种可视化图形的适用性，表达信息，应用场景等。
• 可视化工具宝盒：比如 各种BI系统、Kinbana、Tableau 等的一些操作手 册应用。

赶在年底前，给博客开个头！顺便给 2021 立一个 FLAG, 接下来的一年，主要课题将是 ：数据可视化 | Data Visualization

后续会将数据可视化的学习心得，和一些想法，同步发布到两个博客上：

后续会将数据可视化相关的内容，设为专区，同步发布到两个博客上。

• https://www.xdnote.com/ : 我的个人博客
• https://vis.zone/blog/ : 数据可视化专区

一年又过去了，由于今年的工作内容很多和数据可视化相关，索性建了一个网站 : 数据可视化 。

主要用来介绍数据可视化的相关知识，目前只有图形介绍，包括：

1. 100 多个可视化图，包含了常见别称、中英文介绍、中英文音频朗读。
2. 每个图形还收集了一些在线的参考样例。
3. 通过图形的 适用范围、分类、主要功能、展示形状、输入数据，制作了站点图，可快速导航。

网站使用纯HTML，没有一行JavaScript代码，CSS代码也只有4kb，所以页面效果很粗糙。

用Chrome LightHouse 测试还是不错的，

首页，3项100

最近报着试一试的心态往Chrome应用商店发了一个插件：迷你翻译，没想到居然过了。

先介绍一下插件

Mini翻译, 是一Chrome浏览器的一个插件，功能很简单，将网页上选中的文字翻译成中文，如果选中的是中文，则翻译为英文。

目前支持英、日、韩、法、意、德、俄、越、印、泰等十几个国家的语言的自动识别!

被遗忘的手艺

一位陪伴了我们几乎所有人的老大哥 Flash，2020年12月31日时，就将走到它生命的尽头，终年24岁。

做为一个技术人，它样的事情，其实早已见怪不怪了，只不过面对Flash大佬，略有感怀，就在不远之前，几乎无处不在，即便现在，也常能在各大小网站中见到其身影。

现在，它已经成为了我一项被遗忘的手艺。 想起那些以前耗费不少心力去学习、去研究的技术，开始在我脑中放映： Flash / Flex / ActionScript / AIR / ColdFusion / RED5 / ASP / GWT / YUI / Google Gear / SPrite / webwork / jQuery ……, 感觉像不计其数。

不知道以前用这些技术做出来的项目，现在安在否？现在每天正在使用的一些技能，未来还是否会存在？

需求来临

一天，BOSS来找你做个页面，要求如下：

BOSS： 我们这个页面，用户会打印，顺便提两个小要求
要求1: 打印出来的东西只看到内容，不要出现闲杂等。
要求2: 打印出来的效果要保证，最好和网页上一样。

你听到了，笑而不语，这也太简单了！

对于要求1, 用一CSS点样式就很快的解决了。

@media print {
  .xxx {
    display: none;
  } 
} 

对于要求2，疑惑了一下，难道打印出来会有不同吗？

于是，你点了一下 Chrome浏览器的打印菜单，弹出了一个打印预览,发现效果… 真的没法看！！

这可如何是好？

网页自动化工具，主要是可以通过写代码的方式，自动打开网站，输入，自动与页面交互，得到输出。

我们通常用的按键精灵，抢票软件，基本都是标准的网页面自动化工具。

目前，主流的网页面自动化工具有：

1. Selenium
2. PhantomJS
3. Chrome HeadLess

他们都可以完成网页面上面的各种交互，今天简单介绍一下其中两项技术。