wordcloud2.js
Create a tag cloud/Wordle presentation on 2D canvas or HTML.
This library is a spin-off project from HTML5 Word Cloud.
Visit the demo page
Simple usage
Load wordcloud.js
script to the web page, and run:
WordCloud(document.getElementById('my_canvas'), { list: list } );
where list
is an array that look like this: [['foo', 12], ['bar', 6]]
.
Options available, see API documentation for detail.
Algorithm
Before putting each word on the canvas, it is drawn on a separate canvas to read back the pixels to record is drawn spaces. With the information, wordcloud.js will then try to find a place to fit the word that is closest to the start point.
Testing
Tests are available with QUnit and grunt
. To setup environment for testing, run npm install
and manually install SlimerJS of your platform.
Use grunt test
to ensure all options can be set without JavaScript error.
Use grunt compare --base-commit=gh-pages
to compare your proposed fix with gh-pages
branch.
Acknowledgement
The developer would like to thank Chad Jensen for sponsoring the work on image masking on the demo page.
'프로그래밍 > Script' 카테고리의 다른 글
[Node.js] npm 소개와 설치 & MEAN Stack http://mean.io/ (0) | 2017.08.18 |
---|---|
[Node.js] 실시간 멀티채팅 구현 - node.js + socket.io (0) | 2017.08.10 |
2017년과 이후 JavaScript의 동향 - 브라우저 밖의 JavaScript (0) | 2017.05.30 |
NativeScript - https://www.nativescript.org/ (0) | 2017.05.30 |
[javascript] 15 Interesting JavaScript and CSS Libraries for February 2017 (0) | 2017.03.22 |