Code Monkey home page Code Monkey logo

data-visualization's Introduction

data-visualization

数据可视化:基于d3.js 或 fabric.js 等

市场图表

个人经验:

偏展现场景,建议优先采用类置标语言(Markup Language)的类库,直观;偏交互场景,选用易编程、易定制的类库。

偏展现图表

图表 特点
Echarts
AntV 蚂蚁金服全新一代数据可视化解决方案。包括可视化图形语法库 G2流程图和关系分析的G6面向移动端的可视化图形语法库 F2
Viserjs 基于 G2 的图形库,置标语言( Markup Language)使用方式,支持 React、Angular 和Vue,由 Recharts 等成员开发
Recharts 对 React 和 D3 的封装,置标语言( Markup Language)使用方式,对 React 支持友好,由 Alibaba 成员发起
Frappé Charts 基于 SVG
SVG.js 将 SVG 的置标语言使用方式封装成了一套类似 Canvas (或 D3)的 APIs,增强了 SVG 的交互开发体验
Vega
Vega-Lite

偏交互图表

图表 特点
AntG 3D 图形方向。蚂蚁金服在互联网交互图形领域的探索沉淀,包括 R3WebAR。著名应用有蚂蚁庄园、小鸡快跑等。
Fabric.js
konva
D3
JavaScript InfoVis Toolkit
Protovis D3.js 前身,使用SVG的可视化JS。从后续发展看,不建议在新项目中采用。如重新设计新可视化JS,可参考。

其它

图表 特点
Deck.gl Uber 的一个 WebGL 大规模数据展现库。其他还有 luma.glreact-visreact-map-gl
Planck.js 2D 物理引擎
whs.js 基于Three.js,适用于 Web 应用程序与游戏的3D框架
Embedding Projector 谷歌开源的高维数据可视化
Phaser HTML5 Game Framework
AnyPixel.js 谷歌,个人认为比较适合交互式大屏
LayerVisualizer 一个简单的基于Web的3D图层(可用于可视化材质UI和涉及深度/阴影的其他事物)

项目

图片标定

calibrationbox:一个 Fabric 的小插件,可用于标定图片中车辆、人、交通灯标识、区域等。详见,calibration-box 项目。

网络攻击地图

  • norsecorp

  • ipviking

访问者流报告

netflow:借鉴 Google Analytics 行为流 ,修改自 netFlow

运行

  1. 依赖 Nodehttp-server
  2. 在 data-visualization/server 目录执行 npm install 后,运行 npm start 启动(默认9999端口)
  3. 在 data-visualization 目录执行 http-server
  4. 根据 http-server 中提示的网址,在浏览器(建议 Chrome )中访问
  5. 关闭命令窗口即可退出

附录

反馈

https://github.com/TingGe/data-visualization/issues

贡献

https://github.com/TingGe/data-visualization/graphs/contributors

许可

(The MIT License)

Copyright (c) Ting Ge [email protected]

data-visualization's People

Contributors

tingge avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

data-visualization's Issues

在用 http-server 运行的时候就提示“The header content contains invalid characters”

[Thu, 21 Apr 2016 17:11:12 GMT] "GET /norsecorp/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36"
_http_outgoing.js:348
throw new TypeError('The header content contains invalid characters');
^

TypeError: The header content contains invalid characters
at ServerResponse.OutgoingMessage.setHeader (_http_outgoing.js:348:11)
at ResponseStream.(anonymous function) [as setHeader](E:Program Filesnodejsnode_moduleshttp-servernode_modulesunionlibresponse-stream.js:88:34)
at serve (E:\Program Files\nodejs\node_modules\http-server\node_modules\ecstatic\lib\ecstatic.js:204:11)
at E:\Program Files\nodejs\node_modules\http-server\node_modules\ecstatic\lib\ecstatic.js:134:11
at FSReqWrap.oncomplete (fs.js:82:15)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.