zca*_*ate 100 javascript jquery d3.js
参考这个例子:
http://vallandingham.me/stepper_steps.html
似乎D3和jQuery库在它们都以对象链方式进行DOM操作的意义上非常相似.
我很好奇D3知道什么函数比jQuery更容易,反之亦然.有很多图形和可视化库使用jQuery作为基础(例如,highcharts,flot,wijmo).
请举例说明它们的不同之处.
Ali*_*iba 90
D3是数据驱动的,但jQuery是不是:使用jQuery 你直接操纵的元素,但与D3 你提供的数据和回调至D3独有的data(),enter()而exit()方法和D3操纵元素.
D3通常用于数据可视化,但jQuery用于创建Web应用程序.D3有许多数据可视化扩展,jQuery有许多web应用插件.
两者都是JavaScript DOM操作库,具有CSS选择器和流畅的API,并且基于Web标准,使它们看起来相似.
下面的代码是D3使用的一个例子,这是jQuery无法实现的(在jsfiddle中尝试):
// create selection
var selection = d3.select('body').selectAll('div');
// create binding between selection and data
var binding = selection.data([50, 100, 150]);
// update existing nodes
binding
.style('width', function(d) { return d + 'px'; });
// create nodes for new data
binding.enter()
.append('div')
.style('width', function(d) { return d + 'px'; });
// remove nodes for discarded data
binding.exit()
.remove();
Cas*_*ase 59
d3有一个愚蠢的描述.jQuery和d3完全没有相似之处,你只是不要将它们用于同样的事情.
jQuery的目的是做一般的dom操作.它是一个通用的javascript工具包,可用于您可能想要做的任何事情.
d3的主要目的是使用数据轻松制作闪亮的图形.如果要对数据进行图形可视化,您绝对应该使用它(或类似的东西,或者在它之上构建的东西).
如果您想要一个通用的JS库来满足您的所有交互式表单需求,请考虑使用jQuery或proto或mootools.如果你想要一些小东西,请考虑下划线.js.如果您想要具有依赖注入和可测试性的东西,请考虑使用AngularJS.
一个通用的比较,从维基百科指南.
我明白为什么有人会认为他们是相似的.它们使用类似的选择器语法 - $('SELECTOR'),而d3是一个非常强大的工具,用于选择,过滤和操作html元素,尤其是在将这些操作链接在一起时.d3试图通过声称是一个通用库向你的主页解释这个,但事实是大多数人在想要制作图表时使用它.将它用于平均dom操作是非常不寻常的,因为d3学习曲线非常陡峭.然而,它是一个比jQuery更通用的工具,通常人们在d3之上构建其他更具体的库(例如nvd3)而不是直接使用它.
@ JohnS的回答也很好.Fluent API =方法链接.我也同意插件和扩展引导您使用库的位置.
ame*_*iel 13
我最近一直在使用这两种方法.由于d3使用Sizzle的选择器,你几乎可以混淆选择器.
请记住,d3.select('#mydiv')与jQuery('#mydiv')的返回并不完全相同.它是相同的DOM元素,但它是用不同的构造函数实例化的.例如,假设您有以下元素:
<div id="mydiv" rel="awesome div" data-hash="654687867asaj"/>
让我们抓住一些常用的方法:
> d3.select('#mydiv').attr('rel') ;
"awesome div"
> jQuery('#mydiv').attr('rel');
"awesome div"
似乎是合法的.但如果你再往前走一点:
> d3.select('#mydiv').data();
[undefined]
> jQuery('#mydiv').data();
Object {hash: "654687867asaj"}
eig*_*yes 10
d3用于数据可视化,它通过过滤DOM对象和应用转换来实现.
jQuery是为DOM操作而制作的,它使许多基本的JS任务变得更容易.
如果您希望将数据转换为漂亮的交互式图片,那么D3非常棒.
如果您想移动,操纵或以其他方式修改您的网页,jQuery就是您的工具.
D3不仅仅是视觉图形.数据驱动文档.使用d3时,将数据绑定到dom节点.由于SVG我们能够制作图表,但D3更是如此.您可以使用D3替换Backbone,Angular和Ember等框架.
不确定谁投票,但让我更加清晰.
许多网站从服务器请求数据,服务器通常来自数据库.当网站收到这些数据时,我们必须对新内容进行页面更新.许多框架都这样做,而d3也这样做.因此,您可以使用html元素代替使用svg元素.当您调用重绘时,它会使用新内容快速更新页面.没有像jquery,主干+它的插件,角度等所有额外的开销真的很好.你只需要知道d3.现在d3没有烘焙的路由系统.但你总能找到一个.
另一方面,Jquery的唯一目的是编写更少的代码.它只是在许多浏览器上测试过的javascript的简写版本.如果你的网页上没有很多jquery.这是一个很棒的图书馆.这很简单,并且为多个浏览器的javascript开发带来了很多痛苦.
如果你试图以类似d3的方式实现jquery,它会很慢,因为它不是为那个任务设计的,同样,d3不是设计用于将数据发布到服务器,它只是为了使用和呈现数据而设计的.
好问题!
虽然两个库共享许多相同的功能,但在我看来,jQuery和D3之间的最大区别是焦点.
jQuery是一个通用库,专注于跨浏览器和易于使用.
D3专注于数据(操作和可视化),仅支持现代浏览器.虽然它确实看起来像jQuery,但它使用起来要困难得多.