是一个基于数据操作文档JavaScript库。D3帮助你给数据带来活力通过使用HTML、SVG和CSS。D3重视Web标准为你提供现代浏览器的全部功能，而不是给你一个专有的框架。结合强大的可视化组件和数据驱动方式操作Dom。

Javascript拥有两个相当强大而且受开发者喜爱的方法：split 与join 俩对立的方法。这俩方法能让string与array两种类型互换，也就是数组能被序列化为字符串，反之亦然。我们能把这俩方法发挥得淋漓尽致。下面就来探索里面的一些有趣的应用， 首先介绍一下这两个方法：

你可能不知道，在javascript中，在使用string, number, 布尔类型这些原始值时，都会遇到意想不到的问题。阅读下文，来揭晓里面的秘密。

jQuery指出，在IE6、7下，浏览器的getAttribute()和setAttribute()不能正常获取和设置Attribute的值。

事件测试（4项） {代码...}

样式测试（2.1~2.3）3个 {代码...}

其中为1.1~1.15 15个DOM兼容性测试 {代码...}

浏览器功能测试模块是其他模块的基础。 一般解决浏览器不兼容问题有两种方式：浏览器嗅觉和浏览器功能测试。 jQuery.support 有34个测试项，包括DOM测试（15个），样式测试（3个），事件测试（4个），Ajax测试（2个），盒模型测试（10个）

一般对与dequeue()的定义是“删除队列中最顶部的函数，并且执行它”。我并不赞同用“删除”这个字眼，而是倾向于“取出”，其实这个函数的功能就好像是一个数据结构中队列的指针，待队列中前一个函数执行完后，取下一个队列最顶端的函数。

实现原理 总体结构 $.data(elem, name, data), $.data(elem, name) .data(key, value), .data(key) $.removeData(elem, name)，.removeData(key) $.hasData(elem) 一、实现原理： 对于DOM元素，通过分配一个唯一的关联id把DOM元素和该DOM元素的数据缓存对象关联起来，关联id被附加到以jQuery.expando的值命名的属性上，...

达到的效果： 实现原理： 利用raphael 画出svg图形，同时又自动生成生成相应的html, 这样如果做交互可以直接在html 上做交互。 html: {代码...} connection.js (这个绘制线，可以通用) {代码...} graph.js {代码...} position.json {代码...}

Raphael 采用W3C推荐的SVG以及VML来绘制图形，也就是每个图形就是一个DOM元素，所以你能够很容易取得javascript事件句柄。Raphael 的目的就是提供一种更合适，更容易的的方法来绘制跨平台的矢量图。

前段时间，项目中需要实现模块关联关系的展现，这种关系上下游的归属方不确定，也就是箭头方向不确定，而且模块间的关系复杂，就需要一种比较灵活的算法来实现这种布局。

第一步 准备环境，在linux 下准备lnmp 环境 第二步 下载GraphViz.php, 下载地址： [链接] 第一个demo {代码...} 第二个demo {代码...}

graphviz是贝尔实验室几个计算机牛人设计的一个开源 的图表(计算机科学中数据结构中的图)可视化项目，主要用C语言实现，主要实现了一些图布局算法。通过这些算法，可以将图中的节点在画布上比较均匀的分布，缩短节点之间的边长，并且尽量的减少边的交叉。

第一、文件夹： static/js static/js/build/ static/js/dist/ static/js/lib/ static/js/modules/ 第二、static/js/build/Gruntfile.js {代码...} 第三、index.html {代码...} 需要安装的： node js grunt js grunt-cmd-transport grunt-contrib-concat grunt-contrib-uglify grunt-contrib-clean 遇到的问题及解决方法...

今天在项目中运用seajs, 用得挺来劲，觉得太帅了。我一定会把它发扬光大，下面来看看这个应用。 第一步： 还是需要把所有的库用require 包装起来 jquery: {代码...} jquery 插件： {代码...} 特别注意对于highcharts, highstock, 以及exports, more 等的require; highcharts: {代码...} highstock: {代码...} highcharts...

seajs 主要解决了俩个问题：命名冲突、文件依赖关系 第一步：把引用的库用require 包装起来，比如jquery库 (jquery_cmd.js) {代码...} 第二步：写引人的js (demo.js) {代码...} 第三步：HTML {代码...} 大工告成！

力学图（也称为导向图，也有叫网络拓补图的，反正就是通过排斥得到关系远近的结构）在社交网络研究、信息传播途径等群体关系研究中应用非常广泛，它可以直观地反映群体与群体之间联系的渠道、交集多少，群体内部成员的联系强度等。

左右结构，左边100%；右边宽度固定 css {代码...} HTML {代码...} 左右结构，左边固定，右边100% css {代码...} html {代码...} 左中右结构，左边固定，右边固定，中间100%; css {代码...} html {代码...}

{代码...} 效果：

{代码...} 效果：

添加的代码 {代码...} {代码...} 如果是以上data 的数据结构，可以转换为 前treeData 的数据结构。

{代码...} 效果： 这里需要修改一下几个地方： {代码...} 如果改为水平的就是： {代码...}

{代码...} 效果： 这里主要是把value, type, level 放到数据里面,在下面的两个地方分别取值就ok {代码...}

{代码...} 效果：

svg 第一个实例 {代码...} svg reference [链接] svg 简介 SVG 有一些预定义的形状元素，可被开发者使用和操作： {代码...} SVG绘制基本图形 {代码...} path命令参考[链接] svg rect {代码...} rx 和 ry 属性可使矩形产生圆角。 svg circle {代码...} cx 和 cy 属性定义圆点的 x 和 y 坐标。如果省略 cx 和 cy，圆的中心...

d3.layout.tree - position a tree of nodes tidil 定位节点树tree - alias for tree.nodes tree.nodes 的别名tree.nodes - compute the tree layout and return the array of nodes 计算树布局并返回节点数组tree.links - compute the parent-child links between tree nodes 计算树节点之间的父子关系tree.children -g...

D3.js是一个用来操作基于数据的文档的javascript库，D3能够帮助你使用html,svg和css来呈现数据。D3重视web标准，同时给予你现代浏览器的所有功能，因此，你无须去适应一个专有的框架，同时整合了强大的可视化部件和一个基于数据驱动的方法去操作DOM对象。

焦点管理 HTML5也添加了辅助管理DOM焦点的功能。首先就是document.activeElement属性，这个属性始终会引用DOM中当前获得了焦点的元素。