Событие D3, показывающее «ReferenceError: событие не определено» в Firefox

1

Я использую масштабирование колесика мыши в моей карте d3. Использование кода используется.

.on("wheel.zoom", function() {
    var currScale = projection41039.scale();
    var newScale = currScale - 1 * event.deltaY;
    if (newScale >= 150) {
        var currTranslate = projection41039.translate();
        var coords = projection41039.invert([event.offsetX, event.offsetY]);
        projection41039.scale(newScale);
        var newPos = projection41039(coords);
        projection41039.translate([currTranslate[0] + (event.offsetX - newPos[0]),
            currTranslate[1] + (event.offsetY - newPos[1])
        ]);
        updateContents();
    }
})

Это отлично работает для Chrome, но вызывает ошибку в Firefox:

ReferenceError: событие не определено

Теги:
d3.js
firefox
dom-events

1 ответ

3

Проблема здесь в том, что Chrome следует за функцией Internet Explorer Window.event, в то время как Firefox не работает:

Изображение 174551

Например, с помощью кнопки или любого другого элемента следующий сниппет будет работать в Chrome, но не в Firefox:

d3.select("button").on("click", function() {
  console.log(event)
})

Попробуйте здесь: https://jsfiddle.net/b9h4ntn0/ (Обычно я использую Stack Snippets, но фрагмент будет зависеть в этом конкретном примере)

Решение

Используйте d3.event. Таким образом, вы не полагаетесь на Window.event:

d3.select("button").on("click", function() {
  console.log(d3.event)
})

Следующий код работает как в Chrome, так и в Firefox: https://jsfiddle.net/qj787zmj/

Поделиться
  • 0
    Я заменил событие на d3.event, но при прокрутке значение d3.event.deltaY отличается для chrome и firefox.
  • 0
    По крайней мере, у вас есть ценность! Чтобы получить правильное объяснение, я предлагаю вам опубликовать это как новый вопрос, так как это другая проблема.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню