草庐IT

javascript - 有条件地递归更改所有节点和边的不透明度(d3)

更新:IhavecreatedaJSFiddlehere.请用你的答案发布一个更新的fiddle。我有动态过滤器,用户可以将其应用于数据,但它们会更改节点的不透明度以指示过滤入和过滤出的内容(过滤后的“out”元素仍然部分可见,并且未使用实际的d3filter()函数(故意地))。我还在每个被过滤掉的节点上设置了一个属性(例如node={"name":"test","isFilteredOut":true};)。所以就这个问题而言,即使我使用了“过滤器”这个词,它实际上只是一个有条件的样式更改(我会尝试在这篇文章的引号中加上“过滤器”这个词来提醒这一点)。这一切都很好,但现在我想递归地

javascript - Webpack 2 没有正确摇树 D3.js

当执行import{select}from'd3'时,Webpack将在包中包含所有的d3.js,如下面的bundlevisualization.所示这个问题可以通过执行import{select}from'd3-selection'来解决,但这有点违背了自动treeshaking的目的。Treeshaking在我们的非库代码的简单情况下似乎确实有效。我们在.babelrc中使用"modules":false以保留模块语法并在我们的中使用'module'resolvewebpack.config.jsresolve:{mainFields:['module','browser','ma

javascript - 将 SVG 文本裁剪到 D3 TreeMap 中矩形的宽度

我想知道是否有比使用剪辑路径更简单的方法来限制文本标签的宽度。这是我正在寻找的有关标签的示例:treemap:请注意,标签被包含图block的边界chop了。该特定示例是使用实现的标签,默认情况下具有此行为。但我正在使用SVG我希望有比定义另一个矩形的单独剪辑路径更直接的方法。 最佳答案 您可以将每个包装起来中的元素相同宽度/高度的元素。默认overflow隐藏在内部元素。 关于javascript-将SVG文本裁剪到D3TreeMap中矩形的宽度,我们在StackOverflow上找到

javascript - d3.js 强制定向布局受形状约束

我想知道是否有一种方法可以使用d3.js创建力导向布局并以任意形状限制它所有节点均等价分布在形状内边界到节点的距离等于节点之间的距离我希望已经有这样的解决方案了。否则我的想法是从力导向布局开始,并在每次迭代中检查节点到边界的距离。你有什么建议吗? 最佳答案 你的想法也是我的。在tick函数中,您可以添加额外的力。这是我的建议(未测试):force.on('tick',function(e){node.each(calcBorderDistance).attr('transform',function(d){d.x-=e.alpha*

javascript - 为什么在维度变量中无法识别 .domain、tickFormat 和 tickValues? (d3,平行坐标)

我正在使用d3.js创建一个平行坐标图,但我很难按照我的意愿格式化轴标签。例如,我的轴之一“缓冲液浓度”绘制在对数刻度上,我通过维度变量指定了它,就像这样。vardimensions=[...{key:"b.Conc",description:"BufferConcentration",type:types["Number"],scale:d3.scale.log().domain([.1,100]).range([innerHeight,0]),tickValues:[.1,.2,.4,.6,.8,1,2,4,6,8,10,20,40,60],tickFormat:d3.format

javascript - IE 11 - 日期不工作

这个问题在这里已经有了答案:ToLocaleDateString()changesinIE11(5个答案)关闭4年前。newDate().toLocaleDateString('en-US');//"8/17/2018"newDate("8/17/2018")//有效日期newDate(newDate().toLocaleDateString('en-US'))//无效日期我正在尝试从localdate创建date字符串(见屏幕截图)但它不适用于IE11only。不过,它适用于普通的datestring。我知道""双引号有问题,但无法使其正常工作。有什么建议吗?

javascript - 使用 Cypress.js 测试 D3.js 拖动事件

我有一个使用d3-zoom的SVG对象用于缩放和平移功能。它工作完美,但当我开始使用Cypress.js进行集成测试时,问题就出现了。.我尝试在svg元素上使用标准鼠标事件来模拟拖动行为:cy.get('svg').trigger('mousedown',{which:1,force:true}).trigger('mousemove',{position:'left'}).trigger('mouseup',{position:'left',force:true});上面的例子取自Cypressdraganddroprecipe,它会在nodrag.js文件中产生以下错误:canno

javascript - 如何使用 D3 访问对象数组?

我有一个D3图表,我试图在其中解析内联JSON格式的数组,而不是从外部加载数据。而不是做这样的事情:d3.json("data/tsx.json",function(error,data){data.forEach(function(d){d.dateOrig=d.date;d.date=parseDate(d.date);d.close=+d.close;});我只想像这样解析内联JSON格式的数组:vardata=[{"date":"1-May-13","close":58.13},{"date":"30-Apr-13","close":53.98},{"date":"27-Apr

javascript - 访问使用 OBJMTLLoader 加载的 Object3D

我正在构建一个允许用户以obj/mtl格式上传3D模型的应用程序。管理员在我们的查看器中显示加载对象的预览。我想为用户提供控件来设置加载对象的初始y位置和相机的初始z位置。我已经解决了相机部分,但我在y位置上没有运气。我的代码:varobj3d;loader.load(model_obj,model_mtl,function(object){object.position.y=y_init;scene.add(object);render();obj3d=object;$('#initial_y').change(function(){obj3d.position.y=$(this).

javascript - 这个 3D 饼图中的数据是如何解析的?

我试图掌握Donut3D.js->http://plnkr.co/edit/g5kgAPCHMlFWKjljUc3j?p=preview中的功能处理插入的数据:首先,数据的startAngle设置为0度是在哪里设置的?我想将其更改为45º,然后更改为135º、225º和315º(查看上图)。我找到了这个函数:Donut3D.draw=function(id,data,x/*centerx*/,y/*centery*/,rx/*radiusx*/,ry/*radiusy*/,h/*height*/,ir/*innerradius*/){var_data=d3.layout.pie().s