未捕获错误：未知类型：d3.js v5.4.0中的dragend

Posted 2021-03-30

我正在使用d3.js v5.4.0。

这是我得到的错误：Uncaught Error: unknown type: dragend。

这是因为我试图做以下事情：

            d3.drag()
            .subject(function(d){
                return {x: d.x, y: d.y};
            })
            .on("drag", function(args){
                thisGraph.state.justDragged = true;
                thisGraph.dragmove.call(thisGraph, args);
            })
            .on("dragend", function() {
                // todo check if edge-mode is selected
            });

dragend现在似乎已被弃用了。

我试图找出发行说明，它将在here的新版本中描述替代方案，但是无法做到这一点。

请帮我解决这个问题。

答案

目前您可以通过拖动监听的三个事件（v4和5. v3和之前的版本不同）：

start - 在新指针变为活动状态后（在mousedown或touchstart上）。拖动 - 在活动指针移动后（在mousemove或touchmove上）。结束 - 在活动指针变为非活动状态后（在mouseup，touchend或touchcancel上）。 （docs）

所以，你应该只需要将dragend改为end

var svg = d3.select("body")
  .append("svg")
  .attr("width",500)
  .attr("height",300);
  
var circle = svg.append("circle")
  .attr("cx",100)
  .attr("cy",100)
  .attr("r",20)
  .attr("fill","steelblue")
  .call(d3.drag().on("start", function() {
      d3.select(this).attr("fill", "orange")
    })
    .on("drag", function() {
      d3.select(this).attr("cx",d3.event.x)
        .attr("cy", d3.event.y )
    })
    .on("end", function() {
      d3.select(this).attr("fill","steelblue");
    })
  )

<script src="https://d3js.org/d3.v5.js"></script>

以上是关于未捕获错误：未知类型：d3.js v5.4.0中的dragend的主要内容，如果未能解决你的问题，请参考以下文章

D3.js：“未捕获的语法错误：意外的令牌非法”？

ReactJs 和 D3.js ：未捕获（承诺中） SyntaxError: Unexpected token < in JSON at position 0 at responseJson

未捕获的未知 cloud_name

未捕获的错误：[$injector:unpr] 未知提供程序：$cordovaPushV5Provider <- $cordovaPushV5

未捕获的类型错误：$(...).datepick 不是 asp.net 中 jQuery datetime 中的函数

jsonp 请求中的“未捕获的类型错误：无法读取未定义的属性‘toLowerCase’”