学最有用的
数据可视化作用:
- 1.信息记录(使用图形化的数据记录信息)
- 2.抽象 现实的一种抽象
- 3.展示隐含模式
- 4.传播思想
为什么:
- 1.信息可视化
- 2.清晰直观 视觉基因
和第一节内容一样
视觉编码描述的是将数据映射到最终可视化结果上
tableau类似于exec表格化的操作
百度开源的项目
- 前端 = HTML + CSS + JavaScript(动画效果)
HTML 指的是超文本标记语言 (Hyper Text Markup Language) 内容(文字语言) 标记语言
CSS 指层叠样式表 (Cascading Style Sheets) 样式(大小 样子 格式) 标记语言
*JavaScript = DOM + BOM + ECMAScript
ECMAScript,描述了该语言的语法和基本对象,如类型、运算、流程控制、面向对象、异常等。(标准语言)
文档对象模型(DOM),描述处理网页内容的方法和接口。
浏览器对象模型(BOM),描述与浏览器进行交互的方法和接口。
Echarts
D3 可视化非常好、学习成本高(2D效果)
DECK.GL 3D效果 webGL
4-2 HTML+CSS
<!DOCTYPE html> 版本 <html lang="en"> 页面语言是英文 <head> <meta charset="UTF-8"> 页面是按照utf-8 编码 解码 <title>标题</title> </head> <body> <p>这是一个段落。</p> </body> </html> HTML <meta> 元素 div 没有任何含义,只是一个组织模块。
css颜色样式 层叠样式表
<p style="backageground:**; color:***"> </p>
- 内联样式 在html元素中使用style属性
- 内部样式表 在html文档头部区域中使用
- 外部引用 - 使用外部CSS文件 .css文件
<link> 标签定义了文档与外部资源之间的关系。 <link> 标签通常用于链接到样式表 <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
自定义颜色
id 选择器
id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。id 选择器以 "#" 来定义。
. 是在同级目录下寻找文件
<sccript src="./ecahrts"> </script> console.log(parseInt("1")) 控制台输出
for 循环是初始条件 先判断、当判断合理为ture时 才进行循环。
函数解决重复代码的问,代码重复使用。
javascript 操作DOM能力的非常方便有助于,有助于书写爬虫!
document.getElementById("id") 通过标签拿到html元素,对他进行操作。
数组可以嵌套
object 类似有字典 key-value
- object["d"]
- object.d
a.push()
a.length
软件 类似与ps
使用Adobe Illustrator实现
{ }