DAY.1 - Learning D3

最新推荐文章于 2022-08-26 01:07:28 发布

螺旋藻静

最新推荐文章于 2022-08-26 01:07:28 发布

阅读量108

点赞数

分类专栏：可视化大赛文章标签： D3 Node.js

本文链接：https://blog.csdn.net/sinat_37361473/article/details/71946467

版权

可视化大赛专栏收录该内容

1 篇文章 0 订阅

订阅专栏

#day.1 learning D3

  因为最近和同学一起组队参加了2017年可视化大赛（http://chinavis.org/2017/challenge.html），我也在积极地应战中。
  但是之前完全没有接触过D3相关知识，也从未接触过Javascript语言（像搭建网站什么的一直很想做呀！），只好无奈地从头学起了。
  毕竟新手入门，这篇博客的目的一是记录我自己的学习情况，二是同时给一些新手学习的建议。
  这里我自学的参考书目是老师所推荐的《精通D3.js交互式数据可视化高级编程》-吕之华著。
  **个人配置**：操作系统是win8（当然个人觉得用Linux也很好更方便，但是我已经很久没有打开过Linux系统了orz）。在D3官网上下载了工具包，解压后直接在文件中使用。使用的文本编辑器是notepad++（版本7.3.3），在官网所下。当然直接用windows自带的记事本功能也可以。
  一些推荐的辅助网站：
  1.https://github.com/d3/d3/wiki/Gallery
  2.http://www.open-open.com/lib/view/open1453215528980.html 
  3.https://d3js.org/ [D3官网]
  以上都是我自学d3时用到的。

学习的几个关键点：

html元素的学习

<!DOCTYPE>
  <html>
    <head>
      <title>my frist page</title>
    </head>
<body>
      <h1>hello world</h1>
      <p>!!!<\p>
      <p>so what should I do?</p>
</body>
  </html>

html 下的hello world

总结：在这一个经典的hello world程序里，包含了几种html编程的常用标签。

在html中引用css的方法

发现若是用notepad++编辑html文本的时候无法在网页上出现预设的css选择器，不知道初学者会不会和我一样遇到过这样的瓶颈。

例如：

.hl{color:yellow;}

<p class = "hl">I change!</p>
<p class = "hl">What should I do next?</p>

在网页上的显示却是：
my frist css
并没有按照书上所说的文字属性被转换了。
问题：没有关注到html综合运用的方法。
html——内容是什么
css——如何表现此内容

解决方法：
一个框架↓↓↓

<!DOCTYPE html>
<meta charset="utf-8">
<style>
    The CSS 部分
</style>
<body>
<script type="text/javascript" src="d3/d3.v3.js"></script>
<script>
    The D3 JavaScript code is here
</script>
</body>

Javascript在html中的应用

螺旋藻静

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
DAY.1 - Learning D3

day.1 learning D3 因为最近和同学一起组队参加了2017年可视化大赛（http://chinavis.org/2017/challenge.html），我也在积极地应战中。但是之前完全没有接触过D3相关知识，也从未接触过Javascript语言（像搭建网站什么的一直很想做呀！），只好无奈地从头学起了。毕竟新手入门，这篇博客的目的一是记录我自己的学习情况，二是
复制链接

扫一扫