1.Canvas和SVG的区别
Canvas
概念
Canvas是H5的一个标签，会通过Javascript来绘制2D图形。是逐像素进行渲染的。其位置发生改变，会重新进行绘制。
特点
- 依赖分辨率
- 不支持事件处理器
- 弱的文本渲染能力
- 能够以 .png 或 .jpg 格式保存结果图像
- 最适合图像密集型的游戏，其中的许多对象会被频繁重绘
SVG
概念
一种使用XML描述的2D图形的语言。SVG基于XML意味着，SVG DOM中的每个元素都是可用的，可以为某个元素附加Javascript事件处理器。 在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。
特点
- 不依赖分辨率
- 支持事件处理器
- 最适合带有大型渲染区域的应用程序（比如谷歌地图）
- 复杂度高会减慢渲染速度（任何过度使用 DOM 的应用都不快）
- 不适合游戏应用
两者区别：
-
SVG是用来描述XML中2D图形的语言，canvas借助JavaScript动态描绘2D图形
-
SVG可支持事件处理程序而canvas不支持
-
SVG中属性改变时，浏览器可以重新呈现它，适用于矢量图，而canvas不可以，更适合视频游戏等。
-
canvas可以很好的绘制像素，用于保存结果为png或者gif,可做为API容器。
-
canvas取决于分辨率。SVG与分辨率无关。
-
SVG具有更好的文本渲染，而Canvas不能很好的渲染，渲染中的SVG可能比Canvas慢，特别是应用了大量的DOM。
7.canvas更适合渲染较小的区域。SVG渲染更好的更大区域
2.在设计可视化图表时，canvas和svg如何选择？
图表不是一整张图片，而且带有复杂交互的。
- 如果是较为小且简单的图片，选择svg，因为svg是声明式的，使用方便而且原生支持事件处理器
- 如果是复杂庞大的图表，建议选择canvas，因为复杂的结构会使svg性能低下，且没有很有效的优化手段，至于canvas原生不支持事件处理器，其实可以通过各种三方库来实现，而且还可能需要搭配WebGL来实现各种复杂效果
3.常见的可视化组件库
D3.js
属于前端评价最高的JS可视化图表库。但其大量依赖DOM操作，不容易上手。
Echarts
示例比较丰富，相较于D3而言少；有中文文档，容易理解；Echarts中的图表绘制是直接封装好的，使用方便，容易上手，但灵活性较低。属于目前国内前端数据可视化使用最多的图标库。
AntV
更接近声明式的写法，提供图形基本元素不同特征到数据的映射方式，比Echarts更加灵活。
chart.js
小巧的JS图表库。轻量级、易上手。基于H5，兼容性好，支持所有的现代浏览器；但图形种类少。
Highcharts
超轻量级、易上手、性能好。支持IE6以上所有浏览器，兼容性强；github开源，但商用收费，个人使用有水印。
4.可视化组件库如Echarts的设计思路
zhuanlan.zhihu.com/p/347325932
5.一些偏向底层的可视化组件和前端框架结合方面需要考虑哪些问题？（TODO）
没找到标准答案，但是有Vue整合Echarts时遇到的问题：blog.csdn.net/firewater23…
6.可视化组件如何做到数据驱动？
可以参照Vue的响应式原理去设计组件，具体原理见整理的Vue文档
7.ARIMA预测实现原理
8.高维数据在可视化中的处理方式
概念
高维指数据具有多个独立属性，多元指数据具有多个相关属性。
可视化方式
1.在二维/三维图表上增加视觉通道，以表达更多的属性信息
当维度超过三维后，可以增加视觉编码来表示，例如颜色、大小、形状、填充形式等。但对于更高维多元数据的可视化，这种方法还是很局限。
2.“多视图协调关联”：不同的视图表示数据的一部分属性。
3.利用散点矩阵
对于N维数据，使用N^2个二维散点图逐一表示N个属性之间的两两关系，但是随着数据维度的增加，散点图数量的增加导致可读性下降。
4.利用表格透镜（table lens）
有以下特点：
- 类似于表，以图的形式显示表格中的数值，节省空间，易于观察和发现
- 排序与选择操作：易于发现分布规律与关联关系
- 焦点与上下文：关注的区域以图文强调
- 重组视图：通过移动属性列实现
5.利用平行坐标系
平行的坐标轴表示不同维度，每个数据点对应一条穿过所有坐标轴的折线，在二维空间中完整显示高维数据，不仅可以揭示数据在每个属性上的分布，还可描述相邻属性间的关系。
但对非相邻属性间的关系表现能力较弱，不易于同时表示多个维度关系
