小编108*_*80p的帖子

我正处于JS项目的早期阶段.到目前为止,除了一个形状的定位外,一切都很顺利.所讨论的形状是蓝绿色钻石(正方形旋转45度).我可以让屏幕上的方块没问题,但是当我添加:

    .attr("transform", "rotate(45)")

正方形旋转正确,但向屏幕的左侧部分移动,如下所示:

我不确定是什么导致这种情况发生.如果有帮助,这里有一些产生这个结果的代码:

var svg = d3.select("body")
            .append("svg")
            .attr("width", w)
            .attr("height", h);
        svg
            .append("rect")
            .attr("transform", "rotate(45)")
            .attr("x", 250)
            .attr("height", w / 10)
            .attr("width", w / 10)
            .attr("fill", "teal")

注意:如果我输入"y"属性,则方块完全消失.

是什么造成的？我做错了什么,我看不到？

我对SVG很新(使用D3.js来调用所有东西).最近,我刚刚对我正在进行的项目产生了巨大的限制.我希望能够为我正在使用的每类数据制作"g"类.不幸的是,我从一个只以一种方式连接数据的XML文件中获取数据(例如:person1 ---> person2,但不是person2 ---> person1).我希望能够做的是将我的数据生成的每个形状放在根类和它连接的类中.如果我可以将这个形状添加到两个或更多类(例如g class = person1和person2),那么这将是我认为最快的解决方案......但是这样的事情可能吗？我可以将SVG形状设置为两个或更多类吗？或者它会在我定义新的时候覆盖它.

我真的希望有人能理解我的要求.在不泄露我最终项目的每个细节的情况下,很难用语言表达我的问题.

所以我开始另一个d3项目.该项目包括在LeafletJS画布上在D3中渲染静态网络图(以允许跨我们的其他可视化进行标准化缩放/平移控制).这个网络的问题是它需要环绕x轴(例如:右边的节点可能连接到左边的节点).我希望能够在同一图表的多个实例之间无缝平移,但我不确定这个问题的最佳方法是什么.

到目前为止,我最好的想法是渲染两个相同的可视化副本并将它们一个接一个地定位......然后使用Leaflet的worldCopyJump让一个可视化渲染,同时用户在另一个平移.显然,有一个可视化实例需要1500多个SVG对象,这可能不是最好的方法.

所以你可能不需要确切的代码,但有人可以帮助我想出一个可靠的方法吗？如有必要,我很乐意提供更多细节.