草庐IT

d3_graph_chart

全部标签

javascript - d3js 树方 block

我想使用d3.js构建系谱树。我发现的所有示例都展示了有机树木。有没有类似风格的例子? 最佳答案 您可以使用cluster来完成此操作或tree布局。并使用自定义路径生成器绘制连接节点的正交线,如此elbowdendrogram.我想我受到了启发,所以我试了一下:http://bl.ocks.org/2966094 关于javascript-d3js树方block,我们在StackOverflow上找到一个类似的问题: https://stackoverflo

javascript - 从数据访问 d3.js 元素属性?

我正在尝试访问我已经使用d3.js的.data()函数绘制到屏幕上的某些特定svg圆圈的cx和cy属性,有人可以帮忙吗?尝试访问它的代码如下。d3.selectAll(".mynode").each(function(d,i){if(d.someId==targetId){console.log(d.attr("cx"));//justtryingtodemomypoint,doesn'twork}}我对d3.js和javascript很陌生,所以我不确定我是否正在从头到尾处理这个问题,或者我可能错过了一个内置的解决方案? 最佳答案

javascript - 弧外标签(饼图)d3.js

我是d3.js的新手,我正在尝试用它制作饼图。我只有一个问题:我无法让我的标签超出我的弧线......标签用arc.centroid定位arcs.append("svg:text").attr("transform",function(d){return"translate("+arc.centroid(d)+")";}).attr("text-anchor","middle")谁能帮我解决这个问题? 最佳答案 我可以用三Angular函数解决这个问题:)。参见fiddle:http://jsfiddle.net/nrabinowi

JavaScript Chart.js - 显示在工具提示上的自定义数据格式

我在这里查看了各种文档和类似问题,但似乎找不到特定的解决方案。如果我遗漏了任何明显的问题或重复了这个问题,我深表歉意!作为一些背景信息,我已经使用Chart.js插件实现了4个图表,并使用PHP从数据库中传递了所需的数据。这一切都正常工作并且很好。我的问题是我需要将工具提示中的数据显示为格式化数据。作为带有%的数字。例如,我来自数据库的数据之一是-0.17222。我已将其格式化为百分比以显示在我的表格中,一切都很好。但是,当为chart.js条形图设置数据时,数据显然缺少这种格式并显示为我不想要的-0.17222。对不起,我想发图,但是我的名声太垃圾了!我从数据库中获取数据,然后设置到

javascript - 使用 D3.js 的 3 维(X、Y 和 Z)图

关闭。这个问题不符合StackOverflowguidelines.它目前不接受答案。我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。关闭3年前。Improvethisquestion我正在搜索具有3个维度(x、y和z)并使用D3.js的图表。如果有任何数据可视化网站可以找到这样的图表,或者d3js.org上是否有,请告诉我。我不知何故错过了。

javascript - 将 'onclick' 事件附加到 D3 图表背景

我有一个D3直方图图表,我在上面的条形图上附加了一个“onclick”事件:...varbar=svg.selectAll(".bar").data(data).enter().append("g").attr("class","bar").attr("transform",function(d){return"translate("+x(d.x)+","+y(d.y)+")";}).on('mouseover',tip.show).on('mouseout',tip.hide).on('click',function(d,i){//dostuff});...这完全符合预期。我还想将“

javascript - 如何使 D3.js 中的力布局图响应屏幕/浏览器大小

我有一个使用强制布局的图形,但它具有固定宽度w和高度h:varsvg=d3.select("#viz").append("svg").attr("id","playgraph").attr("width",w).attr("height",h)varforce=d3.layout.force().nodes(nodes).links(links).charge(-1600).linkDistance(45).size([w,h]);尽管屏幕或浏览器窗口大小发生变化,这会导致svg图形不会缩放或缩小。为了使其响应(即自动调整自身大小),我尝试使用viewBox和preserveAspec

javascript - 如何在d3.js中选择当前元素的父元素

我想访问当前元素的父元素这是HTML的结构svggid=invisibleGgcirclegcirclegcircle基本上,当我将鼠标悬停在圆圈上时,我想在圆圈内添加文本。所以我想要在任何特定圆圈上悬停时这样的东西svggid=invisibleGgcircle-->radiusisincreasedandtextpresentedinsidethattextgcirclegcircle悬停时我可以通过d3.select(this)选择当前元素,我怎样才能得到根元素(在我的例子中是g)? 最佳答案 您可以使用d3.select(t

javascript - 将 FontAwesome 图标添加到 D3 图形

我正在尝试使用FontAwesome设置图标而不是我的D3节点中的文本。这是原始实现,带有文本:g.append('svg:text').attr('x',0).attr('y',4).attr('class','id').text(function(d){returnd.label;});现在我尝试使用图标:g.append('svg:i').attr('x',0).attr('y',4).attr('class','idicon-fixed-widthicon-user');但这是行不通的,即使标记是正确的,并且正确地符合CSS规则:图标不可见。知道为什么吗?这是相关的jsbin编

javascript - Charts.js 使用货币和千位分隔符格式化 Y 轴

我正在使用Charts.js在我的网站上显示图表。目前,标签显示为一长串数字(即123456)。我希望它显示为带有千位分隔符的货币:(即$123,456)我正在使用scaleLabel选项在值之前放置一个$USD符号:scaleLabel:""和一个插入逗号分隔符的函数:function(label){returnlabel.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g,",");}我只是不知道如何一起使用这些来获得我想要的东西。这是fiddle:http://jsfiddle.net/vy0yhd6m/79/(请记住,目前该图只有在