Node.js中用D3.js的方法示例


Posted in Javascript onJanuary 16, 2017

前言

D3.js 是一个基于数据操作文档JavaScript库。D3帮助你给数据带来活力通过使用HTML、SVG和CSS。D3重视Web标准为你提供现代浏览器的全部功能,而不是给你一个专有的框架。结合强大的可视化组件和数据驱动方式Dom操作。下面主要介绍了Node.js中用D3.js的方法,感兴趣的朋友一起来学习下吧。

安装模块

npm install d3 jsdom

D3.js是操作DOM来作图的,要在Node.js里使用需要像jsdom这样的模块。

绘制一个圆

var d3 = require('d3');
var jsdom = require('jsdom');

var document = jsdom.jsdom();

var svg = d3.select(document.body).append('svg')
 .attr('xmlns', 'http://www.w3.org/2000/svg')
 .attr('width', 500)
 .attr('height', 500);


svg.append("circle")
 .attr("cx",250)
 .attr("cy",250)
 .attr("r",250)
 .attr("fill","Red");

console.log(document.body.innerHTML);

编辑好后,保存为 drawCircle.js,当然什么名字都可以。

导出SVG图

node drawCircle.js > mycircle.svg

将 drawCircle.js 输出的内容(console.log 里的内容)重定向到 mycircle.svg。

最后得到生成的SVG图:mycircle.svg

总结

以上就是关于在Node.js里用D3.js的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
JavaScript网页制作特殊效果用随机数
May 22 Javascript
JQUERY CHECKBOX全选,取消全选,反选方法三
Aug 30 Javascript
JQuery扩展插件Validate 1 基本使用方法并打包下载
Sep 05 Javascript
javascript for循环从入门到偏门(效率优化+奇特用法)
Aug 01 Javascript
解析瀑布流布局:JS+绝对定位的实现
May 08 Javascript
JavaScript生成的动态下雨背景效果实现方法
Feb 25 Javascript
详解JavaScript的AngularJS框架中的作用域与数据绑定
Mar 04 Javascript
关于JS中match() 和 exec() 返回值和属性的测试
Mar 21 Javascript
js停止冒泡和阻止浏览器默认行为的简单方法
May 15 Javascript
axios 处理 302 状态码的解决方法
Apr 10 Javascript
Fundebug支持监控微信小程序HTTP请求错误的方法
Feb 21 Javascript
React生命周期原理与用法踩坑笔记
Apr 28 Javascript
JavaScript实现的select点菜功能示例
Jan 16 #Javascript
使用AngularJS 跨站请求如何解决jsonp请求问题
Jan 16 #Javascript
JavaScript基于DOM操作实现简单的数学运算功能示例
Jan 16 #Javascript
js实现弹窗暗层效果
Jan 16 #Javascript
js实现简单的计算器功能
Jan 16 #Javascript
Javascript中document.referrer隐藏来源的方法
Jan 16 #Javascript
基于jQuery实现的打字机效果
Jan 16 #Javascript
You might like
vBulletin Forum 2.3.xx SQL Injection
2006/10/09 PHP
php的数组与字符串的转换函数整理汇总
2013/07/18 PHP
PHP实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
PHP汉字转换拼音的函数代码
2015/12/30 PHP
PHP Header失效的原因分析及解决方法
2016/11/16 PHP
PHP对象、模式与实践之高级特性分析
2016/12/08 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
js右键菜单效果代码
2007/07/21 Javascript
javascript 进阶篇3 Ajax 、JSON、 Prototype介绍
2012/03/14 Javascript
Javascript页面添加到收藏夹的简单方法
2013/08/07 Javascript
JQuery的ready函数与JS的onload的区别详解
2013/11/21 Javascript
Js实现动态添加删除Table行示例
2014/04/14 Javascript
JS实现淘宝支付宝网站的控制台菜单效果
2015/09/28 Javascript
jQuery 特性操作详解及实例代码
2016/09/29 Javascript
Vue.js实现在下拉列表区域外点击即可关闭下拉列表的功能(自定义下拉列表)
2017/05/30 Javascript
详解nodeJS之二进制buffer对象
2017/06/03 NodeJs
浅谈React中组件间抽象
2018/01/27 Javascript
微信小程序自定义弹窗wcPop插件
2018/11/19 Javascript
Vue 2.0双向绑定原理的实现方法
2019/10/23 Javascript
微信小程序实现登录注册功能
2020/12/29 Javascript
[02:53]2018年度DOTA2最佳战队-完美盛典
2018/12/17 DOTA
详解Python的Django框架中的模版相关知识
2015/07/15 Python
Python+Wordpress制作小说站
2017/04/14 Python
python使用两种发邮件的方式smtp和outlook示例
2017/06/02 Python
Python3.7+tkinter实现查询界面功能
2019/12/24 Python
基于Python把网站域名解析成ip地址
2020/05/25 Python
python中对二维列表中一维列表的调用方法
2020/06/07 Python
python能做哪方面的工作
2020/06/15 Python
ktv好的活动方案
2014/08/17 职场文书
校园新闻广播稿5篇
2014/10/10 职场文书
个人政风行风自查自纠报告
2014/10/21 职场文书
小学见习报告
2014/10/31 职场文书
本科毕业论文导师评语
2014/12/31 职场文书
李强感恩观后感
2015/06/17 职场文书
军训心得体会范文(2016最新篇)
2016/01/11 职场文书
MySQL中distinct与group by之间的性能进行比较
2021/05/26 MySQL