обработка события mousedown объекта наложения d3 - PullRequest
0 голосов
/ 14 марта 2019

Я недавно делаю топологию сети с d3.js

Имеется панорамирование и масштабирование, перетаскивание объектов, функция рисования линий.

Я реализовал все функции сейчас, но есть проблема.

Когда я рисую линию на главном svg, она хорошо рисует.

Но если я хочу начать рисовать объект (прямоугольник или некоторые изображения), он не работает должным образом.

Поскольку функция перетаскивания объектов поглощает событие 'mousedown'.

[Main svg]
mainSvg
       .on('mousedown', function mouseDown() {
                  // make object(line)
                })
                .on('mousemove', function mouseMove() {
                  // drawing line
                  // update line's x2, y2 coordinates
                })
                .on('mouseup', () => {
                  // drawing end
                });
[Object]
 .call(d3.drag()
                    .on('start', function dragStart() {
                    // make active state
                    })
                    .on('drag', function dragging(d) {
                    // update object's x,y coordinates
                    })

Так что, если я включу режим 'draw', сможет ли он отправить событие 'mousedown' на главный svg?

В режиме рисования я хочу рисовать линии без каких-либо прерываний (например, MS "PowerPoint")

Есть ли какое-либо решение или мне нужно изменить обработку событий?

Спасибо, что прочитали мои вопросы.

1 Ответ

0 голосов
/ 14 марта 2019

Я решил сам.

Мое решение -

d3.selectAll('objects').style('pointer-events', 'none);

, в режиме рисования я отключаю все объекты, нажимаемые на кнопки.

...