Cannot trigger the mouseout event

[qq987462183]

Hello, I am developing an online public platform and would like to use CanvasXpress. May I ask how I can obtain a license? I have not received a reply from the website. In addition, I have encountered a problem. The mouseover event can be triggered, but I cannot trigger the mouseout event, and the program seems to have no response. My code is as follows:

var evts = {
    "mousemove": function (o, e, t) {
        if (o.y.smps.length === 1) {
            var s = o.y.smps[0];
            document.getElementById('t' + s).style.stroke = 'red';
        }
    },
    "mouseout": function (o, e, t) {
        document.getElementsByClassName('cancer').style.stroke = '';
    }
};
var data = {
    "y": {
        "data": [
            [71,460,28,422,17,60,12,93,65,33,5,187,59,1,13,97,15,354,13,24,35,97,2045,199,1632,32,1],
        ],
        "smps": ["BLCA", "BRCA", "CESC", "COAD", "ESCA", "HNSC", "KICH", "KIRC", "LAML", "LGG", "LIHC", "LUAD", "LUSC", "MESO", "OV", "PAAD", "PCPG", "PRAD", "READ", "SARC", "SKCM", "STAD", "TGCT", "THCA", "THYM", "UCEC", "UCS"],
        "vars": ["ceRNA num"]
    }
}
var config = {
    "graphType":"Bar",
    "title": "ceRNA Numbers",
    "legendPosition": "bottom",
    "widthFactor": 3,
    "xAxis2Show": true,
    "xAxisShow": false
}
var cX = new CanvasXpress("canvas2", data, config, evts);

Looking forward to your reply.

[neuhausi]

Hi Alton,
I saw the html page you sent me but there are no elements with id 't' + s in the svg drawing. The canvasXpress event fires ok but it fails to retrieve the document element with the specified id. You will need to send me the complete page if you want me to help you.
Isaac

[neuhausi]

The following code is also giving me an error:

    $(function () {
      for (var i = 0; i < cancerlist.length; i++) {
        document.getElementById(cancerlist[i].organ).addEventListener('mouseover', function handleMouseOver() {
          this.style.filter = 'drop-shadow(0 0 5px red)';
          for (var j = 0; j < cancerlist.length; j++) {
            if (cancerlist[j].organ === this.id) {
              document.getElementById(cancerlist[j].cancer).style.stroke = 'red';
            }
          }
        });
        document.getElementById(cancerlist[i].organ).addEventListener('mouseout', function handleMouseOver() {
          this.style.filter = '';
          for (var j = 0; j < cancerlist.length; j++) {
            if (cancerlist[j].organ === this.id) {
              document.getElementById(cancerlist[j].cancer).style.stroke = '';
            }
          }
        });
      }
      for (var i = 0; i < cancerlist.length; i++) {
        document.getElementById(cancerlist[i].cancer).addEventListener('mouseover', function handleMouseOver() {
          this.style.stroke = 'red';
          for (var j = 0; j < cancerlist.length; j++) {
            if (cancerlist[j].cancer === this.id) {
              document.getElementById(cancerlist[j].organ).style.filter = 'drop-shadow(0 0 5px red)';
            }
          }
        });
        document.getElementById(cancerlist[i].cancer).addEventListener('mouseout', function handleMouseOver() {
          this.style.stroke = '';
          for (var j = 0; j < cancerlist.length; j++) {
            if (cancerlist[j].cancer === this.id) {
              document.getElementById(cancerlist[j].organ).style.filter = '';
            }
          }
        });
      }
    })

[neuhausi]

You also have this string in towards the end of the svg element. What is that supposed to be?

          LAML
          KICH
          LUAD
          LGG
          THCA
          HNSC
          SKCM
          SARC
          LIHC
          MESO
          COAD
          READ
          UCEC
          TGCT
          PAAD
          ESCA
          BRCA
          STAD
          THYM
          PCPG
          PRAD
          BLCA
          LUSC
          KIRC
          OV
          CESC
          UCS