•  19-07-2023
  •  | 
  •  

문제

The charting tooltip does not appear for me. It seems the mouseover isn't even triggering the function to show the tooltip.

I have added an alert message inside the Tooltip's text function, but there is no alert message when I hover the mouse over the marker.

What is wrong in this code ?

Codepen link : http://codepen.io/pradeepsixer/pen/Ldrha

<html>
    <head>
        <script src="dojo/dojo.js"></script>
    </head>
  <body>
    <div id="chartArea">
    </div>
    <div id="legendArea">
    </div>
    <script type="text/javascript">
    require(["dojox/charting/Chart", "dojox/charting/axis2d/Default", "dojox/charting/plot2d/StackedAreas", "dojox/charting/themes/Dollar", "dojox/charting/action2d/Tooltip", "dojox/charting/widget/Legend", "dojo/ready"],
              function(Chart, Default, StackedAreas, Dollar, Tooltip, Legend, ready){
                ready(function(){
                  var mychart = new Chart("chartArea");
                  mychart.addPlot("default", { markers: true, marker: "m-3,0 c0,-4 6,-4 6,0 m-6,0 c0,4 6,4 6,0" })
                  mychart.addPlot("redline", { fill:'#000', stroke: {color:'#f00', width: 2}, markers: true })
                  .addAxis("x", {fixLower: "major", fixUpper: "major", labels:[{value:14,text:'Great'},{value:16,text:'Bread'},{value:18, text:'Soft'},{value:20,text:'Great Bread'}], length:2, natural:true, minorTicks: false, microTicks: false, majorTickStep: 2, majorLabels: true, microLabels: true})
                    .addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", min: 0, max: 20})
                    .setTheme(Dollar)
                  .addSeries("Series A", [{x:14,y:1},{x:16,y:5},{x:20,y:18}], {plot: 'redline'})
                  .addSeries("Series B", [{x:14,y:5},{x:16,y:14},{x:20,y:4}])
                  .addSeries("Series C", [{x:14,y:8},{x:16,y:7},{x:20,y:15}])
                    .render();
//                  console.debug(dc.action2d.Tooltip);
                console.debug(dojox.charting.action2d.Tooltip);
                  new Tooltip(mychart, "default", {
                   text: function(o){
                       alert("Comes");
                      return "Element at index: "+o.index;
                   }
                });
                new Legend({chart: mychart}, "legendArea");
                });
            });
    </script>
  </body>
</html>
도움이 되었습니까?

해결책

I would try rendering your chart after you define the Tooltip. That should get your code to work properly.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top