Как я могу добавлять события в two.js холст в моем приложении?

#javascript #event-handling #frontend #dom-events #two.js

Вопрос:

У меня есть динамические элементы в моем приложении (тег div с типом визуализации canvas, на котором добавляются два конструктора), Каждый раз, когда добавляется элемент, я хочу отображать свойства указанного элемента через диалоговое окно предупреждения или тикер.

Я пробовал addEventListener, но это не работает. Вот фрагмент моего кода ниже:

` var элемент = document.getElementById(‘NN_park’); var элемент = $(«#NN-визуализатор»).getElementById(«НейралЬный парк»);

     var two = new Two({
    type: Two.Types.canvas,
     width: 1300, height: 900
    // fullscreen:
}).appendTo(elem);

var colors = [
    'rgb(255, 64, 64)',
    'rgb(0, 128, 64)',
    'rgb(0, 200, 255)',
    'rgb(135, 90, 68)',
    'rgb(153, 75, 55)',
    'rgb(255, 50, 0)'
];
colors.index = 0;

var radius = 20;
var radialGradient = two.makeRadialGradient(
    0, 0,
    radius,
    new Two.Stop(0, 'rgba(255, 100, 74, 1)', 1),
    new Two.Stop(1, 'rgba(0, 0, 128, 250)', 0)
);


addlayer(default_layers,default_neurons) ;

two.update();

function addneuron(x,y,r)
{
    var circle = two.makeCircle(x, y, r);

    circle.fill = radialGradient ;
    circle.stroke = 'blue';
    circle.linewidth = 2.5;

    circle.addEventListener('mouseover',showTicker(event),false);

    two.bind('update', function(frameCount, timeDelta) {
        circle.rotation = frameCount / 60;
    });

    two.play();



     function showTicker(event){
         console.log("Ticker should be shown")
         var posx = event.clientX;
         var posy = event.clientY;
         $mdToast.show($mdToast.simple()
             .textContent("Perceptron"  toString(posx)   toString(posy)).position('top right').hideDelay(3500));
     };`
 

Здесь функция addlayer вызовет функцию addneuron

Код выполняется в электронной операционной системе приложения: Windows 10