Как можно использовать d3.js (v4) с элементом Polymer 2.0?
Или как использовать библиотеку внутри класса, который уже расширяет другой класс?
Попытка создать элемент полимера d3, чтобы воспользоваться двусторонней привязкой данных полимера, а также синтаксисом и функциями d3. Чтобы данные можно было связать со свойством полимера и передать в функцию d3.data()?
В настоящее время объявление d3 в классе возвращает значение undefined. Нужно ли создавать экземпляр класса с d3 в качестве параметра? Кажется, это работает с Polymer 1.0. Другой подход состоял в том, чтобы создать функцию вне класса и вызвать ее, но это уродливо. Было бы неплохо просто использовать d3 внутри класса.
Или есть более чистый способ?
eg.
<script src="../../bower_components/d3/d3.js"></script>
var d3 = d3;
debugger; // hits this breakpoint first, and d3 is defined here and below
<dom-module id="my-app">
<template>
<svg id="svg"></svg>
</template>
<script>
class MyApp extends Polymer.Element {
static get is() { return 'my-app'; }
static get properties() {
return {
data: {
type: Object,
observer: '_dataChanged'
}
}
}
ready: {
var d3 = d3; // when it breaks here on the above breakpoint this is defined
debugger; // when it hits this breakpoint 2nd, d3 is undefined here and outside the class; what happened? how to scope it in?
}
_dataChanged(newValue, oldValue): {
var circle = d3.select(this.$.svg).data(newValue).enter().append(circle); //d3 undefined(! how to define?)
}
}
window.customElements.define(MyApp.is, MyApp);
</script>
</dom-module>
