c3js: подсказки пользовательского региона, эффекты зависания и т. Д.

Question

Я создаю модуль метрик (используя тайм-ауты) с помощью c3js. Теперь я пытаюсь отобразить события над моими метрическими данными, которые относятся к датам (startDate to endDate). Использование областей c3js показало, что это хороший выбор для этого, потребовалось лишь немного поработать, чтобы сделать их короткими и появиться выше всех моих графических данных.

Проблема заключается в том, что фактическая группа SVG под названием g.c3-regions автоматически отображается за диаграммами. Имеет смысл, не было никакой реальной необходимости позволять любому пользователю взаимодействовать с регионами. Мне нужно это на переднем крае, поэтому я могу привязывать функции hover и click к каждому событию.

Я попытался сделать это с помощью jQuery: $('.c3-regions').insertAfter('.c3-chart'), который просто ставит его спереди. Работает нормально - то есть до тех пор, пока мой экземпляр c3js не переустановит. Затем он выплевывает ошибку, из-за которой возникает проблема с повторным рендерингом регионов (так как они явно перемещены)

Я также попытался клонировать его и поставить перед собой, но он, похоже, не копирует данные SVG ,

Любая помощь будет по-настоящему оценена, может предоставить любые образцы кода по запросу.

Приветствия - - Эндрю

Answer 1

Чтобы расширить комментарий Роберта Лонгсон, в то, что вы хотите добавить это

.c3-event-rect { 
    pointer-events: none; 
} 

.c3-chart { 
    pointer-events: none; 
} 

Это позволит щелкает пройти в области слоя.