前期去浙大学习的时候，学到了相对于自己来说比较新的技术，就是基于D3的数据可视化分析，这篇文章我们先介绍一下怎么去使用D3，以及D3开发所需要的工具配置。
1.编辑器的话个人推荐Visual Studio Code（下载传送门），VS code是一个轻量且强大的代码编辑器，支持Windows和Liunx以及Moc OS操作系统，下面介绍一下这款编辑器的安装步骤，首先点击链接去官网下载安装包。
下载到自定义目录
然后双击安装，具体操作步骤可自行百度或者参考https://blog.csdn.net/x15011238662/article/details/85094006这篇CSDN文章。
2.像这种前端技术，可以需要浏览器的支持咯，推荐Google浏览器，也可自行选择其他浏览器，Google浏览器安装比较简单，可以从电脑的360软件里面下载，如果没有，请自行百度，这个是比较简单的，当然啦，也不一定推荐使用Google，上次看过一篇文章，Google的市场占有率已经超过一半，一方面说明Google确实强大，深受消费者喜爱，但这也是浏览器的一大灾难，就如十多年前的IE，处于垄断地位，所有行业标准都由其来制定，没有竞争，就不能得到更好的发展（有点偏题的哈，简单介绍一些知识）
3.下面需要安装Node.js，先简单介绍一下Node.js。Node.js的是建立在Chrome的JavaScript的运行时，可方便地构建快速，可扩展的网络应用程序的平台。Node.js使用事件驱动，非阻塞I/O模型，轻量、高效，可以完美地处理时时数据，运行在不同的设备上。运行react、D3等就需要Node.js的配置。具体可参考这篇CSDN文章仔细查看Node.js的用处https://blog.csdn.net/weixin_39214481/article/details/82023696。
下面介绍怎么安装nodejs。windows下的NodeJS安装是比较方便的（v0.6.0版本之后，支持windows native），只需要到官网（http://nodejs.org/）或者Node.js中文网(http://nodejs.cn/)，便可以看到下载页面。
具体的安装流程网上也有很多，我就不详细介绍了，推荐一个比较好的安装教程，https://www.jianshu.com/p/2d9fa3659645，这篇简书教程比较详细的介绍了如何去安装Node.js以及如去运行。
4.以上就是前端所需要用到的工具，虽然说D3和react是前端语言，但前端的展示离不开后端的支持，后端目前所涉及到的就是利用python，到目前为止，我所使用的python就是对数据进行处理，下面简单介绍一下python所用到的工具，使用的比较多的就是pycharm和python的IDLE了，这两种工具的安装教程可参考以上两篇文章（文章里有百度网盘的安装包，如果读者觉得百度网盘下载较慢，可自行进入相应的官网进行下载）。
python工具安装完之后，打开CMD命令行，安装可能需要用到的库（安装时如果报错，请尝试用管理员权限：windows用户就是管理员权限打开行命令，macOS就是在命令前加上sudo）
pip install networkx scipy sklearn
①networkx用于处理图数据
②scipy+networkx用于生成矩阵
③sklearn的PCA和TSNE等用于进行降维
以上是python三个独立的第三方库，如果安装较慢，可以拆分安装。
5.下面给一个react demo，你只要进入vis文件夹，运行以下命令就可以启动：
一般需要以管理员身份运行cmd，然后cd到VIS的目录，接下来就是输入命令：
npm i
npm start
然后打开vscode，就可以对demo进行修改啦！
6.在这里顺便讲一下怎么新建一个react项目，打开cmd命令行，输入 npm init react-app vis ，等待数分钟后（可能会比较久），会在当前目录下创建一个名为vis的文件夹。
cd vis
进入文件夹后，会发现会有很多文件生成，其中src文件夹内存放了代码。
npm start
启动项目，会在浏览器中自动打开项目，当你看到如下界面时，说明成功：
安装必要的组件
npm install --save-dev d3 antd axios
d3
ant design（可选，实用的框架，比如提供了按钮等组件，提供了布局）
安装完成后，修改 src/App.css，在文件顶部引入 antd/dist/antd.css。
@import ‘~antd/dist/antd.css‘;
.App {
text-align: center;
}
...
axios（可选）
npm install --save-dev axios
如果有前后端通讯，则可以实用axios用来通讯。
好了 ，以上就是今天所需要介绍的内容，小弟第一次写博客，还有很多知识存在欠缺，或者文章有错误之处，都是很难避免的，希望大家能够在评论里指出错误，感谢哦！
原文：https://www.cnblogs.com/zwing/p/11347403.html