草庐IT

d3_graph_chart

全部标签

javascript - chart.js 不允许使用对数刻度的 y 轴步长

我不得不解析科学记数法,这是对我的图表实现对数刻度的结果,但它打印出了图表中每一行的每个值。似乎没有任何步骤方法有效。RESULTINGCHARTIMGvarpacketsElement=$("#packetsGraph");pckBarChart=newChart(packetsElement,{type:'bar',data:{labels:["Received","Errors","Lost"],datasets:[{label:'#ofPackets',data:packetsArr,backgroundColor:['rgba(55,102,245,0.3)','rgba(5

javascript - d3点击拖动事件嵌套

我在g元素中嵌套了很多元素,如下所示:...但是,我希望有一些矩形能够拥有它们自己的拖动事件。问题是,当您将内容放入g标签时,它的大小会扩展以包含这些标签。因此,即使我可以分配事件,也无法触发它们,因为g标记的事件在某种程度上更重要,即使rect位于它之上。有没有你们知道的某种解决方法?编辑:这里是asimplecompletecase完整地。g内的一个矩形和一个圆。g是可拖动的,圆圈也应该是可拖动的,但不是。vargDragBehav=d3.behavior.drag().on('drag',gDragDrag)functiongDragDrag(d,i){d.x+=d3.event

javascript - 在 D3.js 中注销缩放监听器并恢复滚动能力

我目前正在使用D3.js。这是为我的svg标签注册缩放监听器的代码varzoomListener=d3.behavior.zoom().scaleExtent([0.1,3]).on("zoom",zoom);functionzoom(){vis.attr("transform","translate("+d3.event.translate+")scale("+d3.event.scale+")");}svg.call(zoomListener)现在,当我在svg元素上滚动鼠标时,它会被缩放。但是当我像这样解除绑定(bind)缩放事件时zoomListener.on("zoom",n

javascript - D3.js 饼图..选中时饼图切片可以移动吗?

只是想知道是否可以用d3做这样的事情?http://jsfiddle.net/8T7Ew/当您点击某个饼图切片时,该切片会随点击移动到什么位置?到目前为止已经创建了馅饼,只是想知道我是否可以添加此功能body{font:10pxsans-serif;}.arcpath{stroke:#fff;}varwidth=960,height=500,radius=Math.min(width,height)/2;varcolor=d3.scale.ordinal().range(["#98abc5","#8a89a6","#7b6888","#6b486b","#a05d56","#d0743

javascript - Chart.js & Angular 2 - ng2-charts 自定义点击事件

我正在尝试在我的Angular2项目中实现ng2-charts,我想知道如何创建自定义onclick事件。意思是,我想覆盖购物车上的当前onclick事件以执行一些自定义功能(重定向到页面、显示模态等)。有没有简单的方法来做到这一点?它是内置的吗?任何见解将不胜感激 最佳答案 我在https://github.com/valor-software/ng2-charts/issues/489找到了这个解决方案publicchartClicked(e:any):void{if(e.active.length>0){constchart=

javascript - 在 Chart.js 中隐藏 y 轴的最小值和最大值

我已经使用刻度配置分配了Y轴的最小值和最大值。但是我不希望这些最小最大值显示在图中。我需要在两端隐藏这些值ticks:{callback:function(value){returnparseFloat(value.toFixed(2))},min:y1_min,max:y1_max,fontColor:"#000000",fontSize:12}, 最佳答案 为了隐藏特定的刻度(在你的例子中是第一个和最后一个刻度),你必须使用scaleafterTickToLabelConversioncallbackproperty并在要隐藏的

javascript - Chart.js 条形图溢出其包含元素

Chart.js当padding已应用于容器时,我无法让这个愚蠢的图表留在其容器中。responsive选项是否设置为true并不重要。我将box-sizing设置为什么也无关紧要。如果不适合它的容器,responsive选项的目的是什么? 最佳答案 与大多数CSS一样,答案是使用另一个包装器!我遇到了同样的问题(而且我正在使用框大小调整)只需在Canvas周围放置一个div!(div将继承框大小)祝你好运:) 关于javascript-Chart.js条形图溢出其包含元素,我们在Sta

javascript - .attr 与 D3.js 中的 .classed

在d3中,什么时候用比较合适d3.select("foo").attr('class','bar');相对于d3.select("foo").classed('bar',true);?是否推荐或预期弃用?什么是行业标准? 最佳答案 没有合适的方法,或者推荐的,或者标准的。两者都是有效的方法,使用哪一种取决于您的具体目的。classed("foo",true)和attr("class","foo")的主要区别是前者只会修改classList如果它已经存在...Ifavalueisspecified,assignsorunassigns

javascript - d3.max 没有得到正确的值

这个问题在这里已经有了答案:D3.jsscalereturningwrongvaluesfromdataset(2个答案)关闭7年前。我正在使用d3.js来呈现一些数据,数据集是一个名为bar-data.csv的csv文件,如下所示:date,value,durationwww.sina.com,53,100www.baidu.com,165,2000www.qq.com,269,690www.youku.com,421,224www.facebook.com,405,345www.apple.com,376,777www.cnn.com,359,298www.cctv.com,433

javascript - D3.js 版本 4 使节点具有粘性

我是D3版本4的新用户,我在将固定节点功能添加到力导向布局时遇到问题。我相信这是通过将d.fixed设置为true在v3中实现的,但是我在将其转换为与v4兼容的内容时遇到了问题。我试过添加simulation.fix,但如果不从模拟开始就修复节点,就无法将它集成到我现有的代码中。理想情况下,我想添加一个双击监听器,将节点固定到位,并允许通过拖动功能对其进行定位,然后在再次双击时恢复模拟力。预先感谢您的帮助。这是我的js:varsvgNetwork=d3.select("svg"),width=+svgNetwork.attr("width"),height=+svgNetwork.at