小编ame*_*gin的帖子

D3.js用于力导向图的算法是什么?

我很想知道D3使用什么算法来实现库中的力导向图功能.阅读了Kobourov关于力导向图的历史的总结让我有点困惑的是,库中使用的确切算法或方法(算法/启发式的组合)是什么.

D3 API参考说Barnes-Hut算法用于计算作用于物体的电荷,O(N*log(N))操作.Kobourov的文章提到Quigley-Eades算法和Hu的算法是利用Barnes-Hut的多级算法.其中一个是在D3中以某种方式使用的吗?

API wiki进一步说,Verlet集成用于粒子定位.在源代码中提到高斯-赛德尔算法,该消息又在提到这两个胡锦涛的算法和德威尔的图形布局文件.我想我正在寻找答案的问题是D3使用的"综合"算法; Kobourov的文章列出了几个和D3强制导向的功能似乎并不适合任何一个.

javascript algorithm graph-algorithm d3.js force-layout

10
推荐指数
1
解决办法
3914
查看次数

字符串离散域的连续色标?

我正在实现一个热图,其中单元格背景颜色由d3色标决定.有些值是绝对的; 它们的值可以是N个不同的任意字符串类型,如["6TH","7TH","5TH","4TH"].

给定起始颜色d3.rgb("蓝色")和结束颜色d3.rgb("红色"),如何构建将字符串的离散域映射到连续颜色范围的颜色比例?

我试过了

var scale = d3.scale.ordinal()
    .domain(["6TH", "7TH", "5TH", "4TH"])
    .rangeBands( [ d3.rgb("blue"), d3.rgb("red") ] );
Run Code Online (Sandbox Code Playgroud)

这显然不起作用.

javascript heatmap d3.js

9
推荐指数
1
解决办法
1万
查看次数

Cytoscape.js强制定向布局和节点放置

我最近发现了Cytoscape.js,并想尝试强制导向的布局:乔木和弹性.

现在,我有几个问题:

  1. 是否可以通过使用其中一种布局来实现图形,其中节点放置基于某种算法并且节点坐标不是必需的?例如,在VivaGraphJS中,图形会聚,以便连接的节点形成组,并且单个节点移动到外围.如果这可以在力导向布局上完成,可以关闭力,以便可以在画布上自由选择和拖动节点吗?

  2. Cytoscape如何实际处理大图(节点数/边数)?

  3. 假设每个节点和边缘都有五个属性,我想要一个在鼠标悬停时显示这些属性的文本框.最简单的方法是什么?

  4. Wiki说如下所示可以添加单个节点,但是cy没有节点功能; 这是一个错误吗?var n0 = cy.node("n1"); cy.add(N0); //添加一个元素n0

  5. 我试图创建一个使用Arbor/Springy的琐碎随机数据图.下面的代码在"return data.cy"中给出了"数据未定义"的错误.当布局"随机"时,代码可以正常工作.我究竟做错了什么?

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <style type="text/css">
    .full-height { height: 600px; margin: 0 0; padding: 0 0; }
    </style>

    <script src="jquery-1.7.2.js"></script>
    <script src="demo/cytoscape.all.js"></script>
    <script src="demo/extensions/cytoscape.layout.arbor.js"></script>
    <script src="demo/extensions/cytoscape.layout.springy.js"></script>


    <script src="demo/arbor.js"></script>
    <script src="demo/arbor-tween.js"></script>
    <script src="demo/springy.js"></script>


    <script type='text/javascript'>
        function onLoad() {

             // create a mapper for node size
            var nodeSizeMapper = {
                continuousMapper: {
                    attr: {
                        name: "weight",
                        min: 0,
                        max: 40
                    },
                    mapped: {
                        min: 5,
                        max: 25 …
Run Code Online (Sandbox Code Playgroud)

cytoscape-web

4
推荐指数
1
解决办法
4985
查看次数