Почему событие D3 touch для смартфонов не работает должным образом? - PullRequest
0 голосов
/ 12 декабря 2018

Я написал код для моего разборного дерева, которое отлично работает на экране рабочего стола.Я щелкаю по узлу, по узлу расширяю дальше потомка и так далее.Когда я mousedown на узле, он перетаскивает правильно.

Но когда я открываю дерево на моем устройстве, таком как Android или iphone, оно не работает должным образом.Событие клика работает правильно.Нажав на узел, он расширяется, но когда я хочу перетащить узел, он не перетаскивает.

Когда я нажимаю, чтобы удержать узел на моем мобильном устройстве, выбирается текст узла, а это не то, что мне нужно.,

Я использовал событие touchstart, touchend, предоставленное d3.js.

Мой код для мобильного телефона ниже: -

   if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
                var dragMobile = function(d) {
                    // d3.event.stopPropagation();
                    svg.on("touchstart", function() {
                        d3.event.stopPropagation();
                        var m = d3.touches(svg.node());
                        moveMobile(d, parseInt(m[0]) - parseInt(d.y), parseInt(m[0][1]) - parseInt(d.x));
                        link.attr("d", diagonal);
                        node.attr("transform", function(d) { return "translate(" + [d.y, d.x] + ")"; });
                    })
                    .on("touchend", function() {
                        svg.on("touchstart", null);
                    });
                };

...
var node = svg.selectAll("g.node")
                .data(nodes, function(d) { return d.id || (d.id = ++i); })
                .on("touchstart", dragMobile);

...

var nodeEnter = node.enter().append("g")
.on("click", click)
                .on("touchstart", dragMobile);

Моя функция перемещения: -

function moveMobile(root, xOffset, yOffset) {
            root.x += yOffset;
            root.y += xOffset;
            if (root.children) {
                root.children.forEach(function(d) { move(d, xOffset, yOffset); });
            }
        };
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...