Introduction to the v5 version of D3.js (Chapter 1)
1. Some tools needed
This is actually easy! The easiest thing is to create a .txt file and start typing the code! The author himself uses myeclipse (mainly need to install tomcat), because the front-end is written, a browser to view the effect is of course indispensable, it is recommended to use the chrome browser, its powerful debugging function can make you do more with less!
2. Preliminary knowledge required
If you are a programming novice, then this tutorial may not be suitable for you. It is recommended that you learn a programming language first, such as java (because the first language the author has come into contact with is java, so he has a very good impression of it, and it is easy to learn)
If you have the foundation of a high-level programming language and don't have some front-end knowledge (such as html, css, javascript) at that time, it may be a bit difficult to learn, but it's okay, because the programming languages are somewhat similar! In the process of learning, if you encounter problems that you don't understand, look at the API more, and more Baidu is good.
If you are a front-end god and want to learn D3.js recently, then you will easily get started with D3.js
This tutorial involves knowledge points:
- HTML - Hypertext Markup Language, used to design web content
- CSS - Cascading Style Sheets for styling web pages
- JavaScript - a scripting language for designing web page behavior
- SVG - Scalable Vector Graphics for drawing visualizations
3. Getting started with D3.js
- While watching this tutorial, do the following two methods
- Official API: http://d3js.org/
- If you don't understand, use Baidu, look at other people's cases, and read other people's code more
(The two methods are recommended in parallel, but the focus can be on the second method, because the official API is not very detailed, even if you look at it for a long time, you may not see anything, but you may know what needs to be done. At this time, you can Baidu with a purpose, which makes it easier to find the answer!)
4. Use D3.js in your code
<head><script type="text/javascript" src="http://d3js.org/d3.v5.min.js"></script></head>
That is, add <script type="text/javascript" src="http://d3js.org/d3.v5.min.js"></script> to the head tag
It can be found that the v5 version is used in http://d3js.org/d3.v5.min.js , of course, you can also change to other versions, if you want to use the v3 version, just change v5 to v3