Leaflet + D3 - Нет наведения мыши на Safari

Question

Leaflet + D3 - Нет наведения мыши на Safari

0

У меня проблема с Safari и создание карты с помощью Leaflet: это небольшая демонстрация http://jsfiddle.net/DBJb7/.

Свойство CSS hover работает только в Safari. Я пытаюсь решить его с помощью z-index но он не работает.

У кого-нибудь есть идея?

Изменение: http://bost.ocks.org/mike/leaflet/
Этот проект, похоже, имеет ту же проблему.

Matthieu 29 окт. 2013, в 16:05

Источник

Теги:

html

d3.js

leaflet

css

safari

1 ответ

Ещё вопросы

th3n3wguy · Answer 1 · 2013-10-29T20-45-00.000Z

Вы можете попробовать выполнить следующий код в своем JavaScript D3.js вместо использования CSS:

var feature = g.selectAll("path")
        .data(collection.features)
    .enter().append("path").attr('style','z-index:9999')
    .on("mouseover", function() {
        d3.select(this).css("fill", "green").css("stroke", "red");
    })
    .on("mouseout", function() {
        d3.select(this).css("fill", "").css("stroke", "");
    });

Я обнаружил, что использование стилей JavaScript для применения стилей было намного более эффективным и простым в обслуживании, чем попытка использовать CSS для этого, если только вы специально не используете классы. В этом случае я бы использовал метод .classed() (https://github.com/mbostock/d3/wiki/Selections#wiki-classed), чтобы управлять добавлением и удалением классов.

Надеюсь это поможет! Если нет, извините. : -/

ИЗМЕНИТЬ 1

Я отредактировал, чтобы включить функциональность mouseout. Изучив это более глубоко, дело "Листовка" просто тянет новые образы, а не перерисовывает SVG, что и делает D3.js. Мое единственное предположение - Safari игнорирует z-индекс вашего элемента пути. Это проявляется всякий раз, когда вы щелкаете правой кнопкой мыши по области пути и затем выбираете Inspect Element из раскрывающегося списка. В Chrome он покажет вам HTML-код для элемента path, но в Safari он покажет вам HTML-код для изображения, которое втягивается в материал Leaflet.

Я обновил свой jsfiddle: jsfiddle.net/DBJb7/2 Это не работает с Safari :(