草庐IT

javascript - d3 v4 圆环图具有与小值重叠的文本和折线

我正在尝试弄清楚如何排列标签以使它们不重叠。这是图表的图片如您所见,对于非常小的值,文本标签重叠。我试图遍历每个文本元素并修改它的位置,但这似乎不起作用。你可以在这个函数的底部看到我试图获取每个文本元素的位置然后修改它。我究竟做错了什么?我已经研究了几个小时。_renderDonutChart(){letself=this;//console.log("DonutChartisbeginningrender")lettextOffset=14;self.graph.data[0].forEach(function(d){d.value=+d.value;})console.log(se

javascript - d3.js - 变换和过渡,多行

我已按照以下说明进行操作:http://bost.ocks.org/mike/path/用于使用单行创建和动画化单个图形。并且,弄清楚了如何在图表中创建多条线:DrawingMultipleLinesinD3.js主要问题:在将新数据移动并插入我的数据阵列后,我很难转换多行。我创建了N行:(时间:纪元时间,向前迈进)varseriesData=[[{time:1335972631000,value:23},{time:1335972631500,value:42},...],[{time:1335972631000,value:45},{time:1335972631500,value

javascript - Requirejs、d3 和 nvd3 集成

我正面临整合requirejs的问题与d3和nvd3,并且我使用require的shim找到了一个简单的解决方案.使用垫片我可以导出一个变量,我也可以定义依赖关系:d3:{exports:'d3'},nvd3:{exports:'nv',deps:['d3']},这样,我只需用bower安装d3和其他包,并用require包含它们,它非常快速和干净。尽管如此,我遇到了以下问题:全局d3变量和本地变量(注入(inject)到需要的模块中的变量)之间可能存在一些冲突。这是与转换和选择相关的d3/require/nvd3集成问题。我不完全理解这个问题,但我已经可以做出一些考虑。jquery和

javascript - 适合与 D3js 结合的库,以允许绘制到 webgl (2D)

这是我正在尝试做的:http://mbostock.github.com/d3/talk/20111116/iris-splom.html但我想在webgl2d中执行此操作(因为SVG性能非常慢,渲染10kSVG仅已降至12fps)通过快速搜索,我发现了几个webgl-2d库:cocos2d-html5,pixijs,Three.js和webgl-2d(废弃?)它们看起来很简单,但我想做的是数据可视化。cocos和pixijs是2d游戏库。我是webgl和那些库的新手,所以SO方面的专家你们能推荐一下吗?我需要的东西的总结:互动:地block内的矩形选择。单击以选择某些元素。缩放和平移

javascript - 如何在 Rickshaw/D3 中设置 x 轴的最小值/最大值?

我想显示“今天”的基于时间的数据的线性图。中午时,只有一半的图表会被填充,因为系列不包含更多数据。如何让rickshaw显示完整的图表,而不仅仅是包含现有数据的时间范围? 最佳答案 我遇到了同样的问题并通过添加具有所需最小和最大x值的null数据点解决了这个问题:vargraph=newRickshaw.Graph({element:document.getElementById('chart'),width:500,height:200,renderer:'line',series:[{data:[{x:-5,y:null},{x

javascript - 有什么方法可以在大文件上加速 d3.csv 吗?

许多大型CSV文件可以使用例如压缩显着压缩压缩包。有什么方法可以通过减少需要通过互联网传输到浏览器中的javascript的数据量来加速大型CSV文件的D3。例如,如果我有一个30MB的CSV文件foo.csv压缩成一个9MB的foo.csv.gz文件,我可以传达较小的文件并调整D3以在执行其余操作之前解压缩它吗?d3.csv处理。 最佳答案 没有。D3不提供任何处理压缩文件的功能。您可以使用第三方库,例如JSZip,但是您将无法直接使用d3.csv。 关于javascript-有什么方

javascript - d3 Sankey - 是否有可能影响或决定节点的位置?

我正在使用d3.js的Sankey插件。有没有办法影响节点的自动放置?如果你比较下面两张图片。自动生成桑基图:https://files.secureserver.net/0s3DEU5s3OZtqL在我手动重新排列后:https://files.secureserver.net/0sYJF1w7f54wdF您会看到节点彼此居中对齐,这使得在您手动重新排列节点之前很难使用图表。我能否以某种方式影响此流程-还是它就是这样?顺便问一下-有没有办法指定节点的文本不应长于节点的高度? 最佳答案 根据demo及其解释,没有办法影响放置(并且简

javascript - 如何进行多个 api 调用以在 d3 图表中显示单个数据

我正在尝试使用d3在图表中显示数据,方法是使用相同的数据但不同的日期进行2个单独的api调用。第一次API调用:vardata1={'name':'test','id':7948237982937,'startDate':startDate1,'endDate':endDate1,'tz':getTimezoneOffset()};vardata2:{'name':'test','id':7948237982937,'startDate':startDate2,'endDate':endDate2,'tz':getTimezoneOffset()};我正在尝试进行调用并按如下方式显示图

javascript - d3j蛇弯曲路径动画

我有兴趣尝试创建一个受控的弯曲路径。有没有办法绘制特定的坐标和样式来模仿这种设计。我把它想象成一种2DDonnieDarko时间隧道或slinkey/snake。更新1-旅程路径1http://jsfiddle.net/0ht35rpb/241/更新2-旅程2**我用stroke-linecap:round--http://jsfiddle.net/0ht35rpb/243/赋予了它更柔和的外观更新3-旅程3http://jsfiddle.net/0ht35rpb/245/^我已经开始创建多条路径线-好好组织一下,这样更容易制作/控制--本质上,旅程需要包括要通过的关键大门和拐Angu

javascript - d3.js 可见区域计算或如何绘制地理矩形

我想弄清楚如何正确计算可见区并使用d3.geo投影绘制它。在我的例子中,可见区域是光学相机平截头体现在,我有两个图,都代表视点的方位Angular和仰Angular,一个是日经投影(根据wiki)://thismagicnumberisexperimentallyfound//pixelsinonedegreeingnomonicprojectionchartwithscale1500varpx=26.8;下面的宽度和高度是光学相机视角,以方位Angular和仰Angular轴的度数表示varw=px*viewport.width;varh=px*viewport.height;d3.