未经许可,禁止Copy

简介

巴西米纳斯联邦大学的一个软件工程应用研究小组仿造 Code City(简介看这个帖子),用 three.js 3D 库做了 JSCity,也是用于源码可视化。

示例截图

来,先上一个“小城市” socket.io 的图:
socket.io

JSCity 把:

  • JS 程序转成城市;
  • 文件夹转成区域;
  • 文件转成子区域;
  • 函数转成建筑物;
  • 内部函数也转成了建筑物,不过是放在它们嵌套的函数/建筑物之上

其他

  • 函数源码行数表示建筑物的高度;
  • 函数中变量数量转成建筑物地基;
  • 蓝色建筑是有名字的函数;
  • 绿色建筑是匿名函数;

主页:https://github.com/aserg-ufmg/JSCity/wiki/JSCITY

示例

小提示:

  • 鼠标左键转变视角;
  • 鼠标中键可放大/缩小;
  • 鼠标右键拖动

小城市(几秒钟就加载完了)

backbone
chartjs
clumsybird
deckjs
impressjs
isomer
soket.io
mustache
parallax
respond
reveal
slick

中型和大型城市(加载有点费时哦)

algorithmsjs
bootstrap
bower
threejs
express
florajs
ghost
grunt
gulp
ionic
jade
jasmine
jquery
jqueryfileupload
leaflet
less
mootools
paperjs
pdfjs
pixi
react
select2
semanticui
ace
angular
modernizr

未经许可,禁止Copy!

16 2 收藏


直接登录

推荐关注