I have a SVG and I want to add an event listener on it.
My structure is the following one:
<template name="dataGraph">
<div style="height: 100%;" class="right_col" role="main">
<div id="logoObject">
<object id="svg_compose" type="image/svg+xml" data="output.svg">Your browser does not support SVGs</object>
</div>
</div>
</template>
and in my JavaScript I did:
Template.dataGraph.onCreated(function dataGraphOnCreated() {
});
Template.dataGraph.onRendered(function dataGraphOnRendered() {
$(document).on('click','svg',function(){
alert('You clicked me svg');
});
$(document).on('click','#svg_compose',function(){
alert('You clicked me svg_compose');
});
$(document).on('click','#logoObject',function(){
alert('You clicked me logoObject');
});
});
Template.dataGraph.events({
'click #svg_compose': function(e){
console.log("we are in the svg element");
}
});
and the only listener who works is the one of #logoObject
My goal is to print the content of <text>
when we click on the element.
Could you help me to get that ?