Невозможно переписать машинопись из-за ошибки события d3

Question

У меня есть диаграмма диаграммы рассеяния d3 в проекте Angular 2 с использованием машинописных и webpack. Часть диаграммы отвечает на событие mouseover для отображения всплывающей подсказки. Теперь событие mouseover действительно срабатывает отлично, однако я вижу ошибку, когда webpack транслирует машинопись.

Property 'pageX' does not exist on type 'Event | BaseEvent'. 

Вот фрагмент, показывающий часть курсора, находящегося элемента диаграммы и обижая d3.event.pageX.

.on("mouseover", (d: any) => { 
    if(d.roleName) { 
     div.transition() 
     .duration(200) 
     .style("display", "block") 
     .style("opacity", 1); 
     div.html(d.roleName + "<br/>" + d.org.name) 
     .style("left", (d3.event.pageX) + "px") 
     .style("top", (d3.event.pageY-80) + "px"); 
    } 
    }) 

Я относительно новый для машинописи, но собрать выше вопрос может быть что-то делать с d3 типизацией файла не правильно отображение?

Любое руководство очень ценится.

Answer 1

Поскольку d3 не является реальной библиотекой TypeScript, мы получаем файлы .d.ts для описания исходной библиотеки. В этом случае он не может знать, что внутри на («Mouseover», что на самом деле d3.event означает MouseEvent, так что вы можете попробовать его отливки другого типа или игнорировать эту маленькую часть от компилятора:

.on("mouseover", (d: any) => { 
    if(d.roleName) { 
    div.transition() 
     .duration(200) 
     .style("display", "block") 
     .style("opacity", 1); 
    div.html(d.roleName + "<br/>" + d.org.name) 
     .style("left", ((<any>d3.event).pageX) + "px") 
     .style("top", ((<any>d3.event).pageY-80) + "px"); 
    } 
}) 

Answer 2

Как вы можете видеть здесь https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/d3/d3.d.ts

интерфейсы Event|BaseEvent имеют НЕ свойства pageX|pageY.

Возможно, вам стоит открыть проблему.