d3-chart-lib's People
d3-chart-lib's Issues
项目中用到的工具
- yeoman 用于生成项目结构
- gulp 项目开发中的质量监控,自动化测试和最后的打包
- git 版本控制
- bower 客户端包管理器
- npm 服务器端包管理器
关于图表组件的设计
一、 关于模块加载
模块化的设计,目的是减少全局污染、隐藏私有对象和多人协同开发。
目前想到的可行方案:
- 命名空间方式 namespace.util、namespace.http
- 闭包 var moduleA = (function() { return 'A' })
- 自己实现amd,核心api是define、require和use
- 使用node将amd、cmd和commonjs规范的代码编译成浏览器端可用的js
二、如何使用
设计思路是将整个图表包装成一个web组件,灵感来源于jquery插件和angular的directive
这与当前流行的web compoent组件化思路一致,未来切换到shadow dom也会很顺利
一个图表由3部分组成,html代码段,js和样式。在使用默认样式的情况下,代码大致如下:
chart#map(data-name="worldMap")
config(src="data/style.js")
event(data-name="hover", data-type="highlight")
component(data-name="axis")
var map = document.getElementById('map')
Y.init(map)
三、事件绑定
事件绑定分两种,一种是通过event标签绑定,默认支持约10种事件。另一种是通过重写事件来进行扩展绑定。这里主要介绍扩展绑定。
var map = T.find('#map')
// 以下事件均为延迟绑定
map.country = {}
map.country.click = function(d, i, obj) {
obj = d3.select(obj)
obj.style('fill', 'red')
}
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.