前言

D3.js 是一個(gè)基于數(shù)據(jù)操作文檔JavaScript庫(kù)。D3幫助你給數(shù)據(jù)帶來(lái)活力通過(guò)使用HTML、SVG和CSS。D3重視Web標(biāo)準(zhǔn)為你提供現(xiàn)代瀏覽器的全部功能，而不是給你一個(gè)專有的框架。結(jié)合強(qiáng)大的可視化組件和數(shù)據(jù)驅(qū)動(dòng)方式Dom操作。下面主要介紹了Node.js中用D3.js的方法，感興趣的朋友一起來(lái)學(xué)習(xí)下吧。

安裝模塊

npm install d3 jsdom

D3.js是操作DOM來(lái)作圖的，要在Node.js里使用需要像jsdom這樣的模塊。

繪制一個(gè)圓

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，當(dāng)然什么名字都可以。

導(dǎo)出SVG圖

node drawCircle.js > mycircle.svg

將 drawCircle.js 輸出的內(nèi)容（console.log 里的內(nèi)容）重定向到 mycircle.svg。

最后得到生成的SVG圖：mycircle.svg

總結(jié)

以上就是關(guān)于在Node.js里用D3.js的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，如果有疑問大家可以留言交流。