获取给定元素的活动(正在运行)D3 v3 过渡的标准方法是什么?

2024-04-05

D3 的抽象仍然让我心烦意乱,所以希望我正确地表达了这一点。

In D3 版本3,给定一个元素(比如一个圆),并且给定每个元素仅可能运行一个转换 http://bost.ocks.org/mike/transition/#per-element确定该元素当前正在运行的转换是什么的最佳方法是什么(如果有的话)?

我知道我可以手动检查__transition__关于元素(尽管也欢迎提供帮助),但我真的希望得到更高级别的东西。

我这里更大的目标是当且仅当存在到子的转换时创建子转换。否则,我将创建一个新的过渡。


另一种方法是:在每个存储实际数据数组的节点上创建自己的属性d3.transition对象。创建新过渡时,从数组中获取最后一个过渡并创建子过渡。

复杂的是,您的新过渡可能不基于与活动过渡相同的选择。因此,我在每个元素的基础上创建新的“安全”转换.each() call.

function saveTransition(t) {
    //save the transition immediately (don't wait for "start")
    //clear it on "end"
    t.each(function() {
        var tArr = this.__tObj__
        if (!tArr) tArr = this.__tObj__ = [];

        tArr.push(t);
        //console.log("saving ", t, " for ",this);
      } )
     .each("end", function() {
        var test =  this.__tObj__.shift();
        // console.log("clearing ", t, " from " ,this, 
         //            (test == t ? "correctly" : "ERROR") );
       } );
}
function newSafeTransition(node) { 
    var tArr = node.__tObj__; 
    if ( tArr && tArr.length ) {

        var t = tArr[ tArr.length - 1 ];
        return t.filter( function(){ return this === node; } )
                .transition().call(saveTransition);
    }
    else {
        return  d3.select(node).transition().call(saveTransition);
    }
}

d3.selectAll("div.foo")
    .transition().duration(3000)
    .call( saveTransition )
    .style("left", "100px");

d3.selectAll("div.bar")
    .transition().duration(3000)
    .call( saveTransition )
    .style("top", "100px");

setTimeout( function() { 
    console.log("blue");

    d3.selectAll("div.blue")
      .each( function() {
            newSafeTransition(this).style("color", "blue");
        });
}, 1000);

setTimeout( function() { 
    console.log("reposition");

    d3.selectAll("div.foo")
      .each( function() {
            newSafeTransition(this).style("left", "0px");
        });
}, 2000);

http://jsfiddle.net/7SQBe/3/ http://jsfiddle.net/7SQBe/3/

它可能会被清理,你甚至可以覆盖selection.transition() and transition.transition()自动执行此操作的方法。但是,您可能希望保留一种方法来指示是否要在任何计划的转换之后对新转换进行排队,或者是否要中断。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

获取给定元素的活动(正在运行)D3 v3 过渡的标准方法是什么? 的相关文章

随机推荐

  • 对.net中多重继承的质疑

    我们知道 net中所有的类都是继承自对象类的 假设我们创建一个名为 ClassA 的类 然后我们创建另一个类 名为ClassB 它继承自ClassA 这不是多重继承吗 因为ClassB同时继承自Object类和ClassA 这不是违反了C
  • 如何以编程方式从 Office 文件中提取和操作图像?

    如何从 PowerPoint 和 Word 文档中提取一些图像 以便对其进行操作 然后将图像放回 MS Office 文件中 Apache 有一个名为 POI 的项目 专门用于与 Java 中的 MS Office 格式进行交互 希望这对你
  • 从 cygwin bash 成功克隆后,本地 Git 存储库不存在

    当我克隆到通过绝对路径引用的目录 不存在 时 git 不会抱怨任何事情 报告 0 退出代码 但目录是not创建的 Git 遵守目录do当我重试时存在 user host tmp git clone https github com zand
  • com.mongodb.MongoSocketOpenException:打开套接字时出现异常(MongoDB、Docker)

    我尝试使用 docker 映像启动我的应用程序 Spring Boot Spring Cloud Eureka MongoDB 但无法连接到 MongoDB 例外 exception com mongodb MongoSocketOpenE
  • 解决电力塔

    a 2 Power 10 6 10 9 3 Power 4 9 7 5 TwoTower n Nest 2 1 n 最小的是什么n这样TwoTower n gt a This question http www quora com How
  • 如何给 git 仓库命名?

    我正在使用这些命令创建远程仓库 mkdir NewRepo cd NewRepo git init 然后我将此存储库克隆到本地 git clone user server path to app git 这对我有用 但我想给仓库命名 像其他
  • 我如何监听所有具有参数化名称的 Seam 上下文事件?

    接缝会起火不同类型的事件 http docs jboss org seam latest reference en US html events html d0e5252与特定范围 任务或流程相关 并将范围 任务或流程的名称附加到事件末尾
  • 获取两个给定日期之间的 SUM

    如果我想获得一定日期范围内的总消耗量 我该怎么做 我想我可以这样做 SELECT id SUM consumption FROM consumption info WHERE date time BETWEEN 2013 09 15 AND
  • 在 Java 中使用 Visual Studio Code 的 Azure Functions 项目

    我正在尝试使用 VSCode 创建 azure 函数并将其部署到 azure 我按照官方文档的描述进行操作 https learn microsoft com en us azure azure functions functions cr
  • 即使数据没有改变,useEffect也会多次渲染

    如果依赖项数组为空 则此 useEffect 将渲染一次 但如果我将folderRef 放入依赖项数组 则此 useEffect 将渲染多次 我只想在添加或删除某些文件夹时渲染组件 请帮忙 import React useState use
  • 滑动删除不显示删除按钮

    我肯定在这里遗漏了一些东西 这应该没那么难 我正在尝试在 iPad 上的 UITableView 中的项目列表上实现基本的滑动删除功能 一切似乎都正常 除了当单元格向左滑动时没有删除按钮 只有空白区域 以下是我在适当功能中的内容 BOOL
  • 使用 tree-model-js 将树转换回 JSON

    是否有一种方法可以将 TreeModel 转换为 JSON 字符串 这样它就可以被存储 然后使用tree parse 目前在尝试时JSON stringify root 它给出了关于循环引用的明显错误 因为子级包含父级 父级包含子级 Use
  • C++ getline 在 Windows 中读取整个文件

    这看起来像一个类似的问题this one https stackoverflow com questions 12152311 c getline reads entire file 但是我认为我的情况实际上可能有点不同 代码如下 void
  • ASP.NET MVC 区域中的自定义错误覆盖

    我想要 MVC 区域特有的自定义错误页面 不幸的是 Web config 覆盖系统似乎没有考虑 MVC 文件夹结构 如果我想覆盖一个名为 mobile 的区域 我必须创建一个名为 mobile 的根项目文件夹 包含视图和控制器 并将 Web
  • Sublime 插件:查找并选择文本

    我有插件sublime text 3这让我可以将光标移动到行号 import sublime sublime plugin class prompt goto lineCommand sublime plugin WindowCommand
  • 如何调用Postgres函数返回SETOF记录?

    我写了以下函数 Gets stats for all markets CREATE OR REPLACE FUNCTION GetMarketStats RETURNS SETOF record AS BEGIN SELECT R appr
  • document.querySelector 在 .js 文件中不起作用[重复]

    这个问题在这里已经有答案了 If var raster document querySelector canvas 在 HTML 文件中 定义并声明了栅格 但是 我希望将所有内容都放在 js 文件中 只将函数调用放在 HTML 中 当我尝试
  • AWS Lambda SQS 触发器限制/限制

    我有一个 AWS SQS 队列 我将使用 Lambda 函数触发器对其进行设置 以便为添加到队列中的每个项目运行 Lambda 函数以执行一些处理工作 处理的一个步骤是访问 API 端点 为添加到队列中的每个项目取回一些数据 然后将其存储在
  • C++11 std::thread::detach 和访问共享数据

    如果您之间有共享变量std thread和主线程 或任何其他线程 即使您执行thread detach 创建线程后立即调用方法 是的 调用后仍然可以访问全局变量 捕获变量和传入变量detach http en cppreference co
  • 获取给定元素的活动(正在运行)D3 v3 过渡的标准方法是什么?

    D3 的抽象仍然让我心烦意乱 所以希望我正确地表达了这一点 In D3 版本3 给定一个元素 比如一个圆 并且给定每个元素仅可能运行一个转换 http bost ocks org mike transition per element确定该