【问题标题】:How to show only one tool tip at a time如何一次只显示一个工具提示
【发布时间】:2017-05-28 15:17:56
【问题描述】:

我正在使用画布 js。我有饼图和甜甜圈图。使用工具提示有点问题。如果我将鼠标悬停在圆环图和饼图上,我可以看到两个图表的工具提示。像这样

-

这里是链接 jsfiddle

代码非常简单—— HTML

<div id="parent">
  <div id="doughnutContainer" uniqueID ='doughnut'></div>
  <div id="pieContainer" uniqueID ='pie'></div>
</div>

使用数据创建图表 -

var chart1 = new CanvasJS.Chart("doughnutContainer",
{        
    data: [
    {
        type: "doughnut",
        dataPoints: [
            { y: 71 },
            { y: 55 },
            { y: 50 },
            { y: 65 },
            { y: 95 },
            { y: 68 },
            { y: 28 },
            { y: 34 },
            { y: 14 }
        ]
    },

    ]
});
var chart2 = new CanvasJS.Chart("pieContainer",
{        
    backgroundColor: "transparent",
    data: [
    {
        type: "pie",
        dataPoints: [
            { y: 71 },
            { y: 55 },
            { y: 50 },
            { y: 65 },
            { y: 95 },
            { y: 68 },
            { y: 28 },
            { y: 34 },
            { y: 14 }
        ]
    }
    ]
});

chart1.render();
chart2.render();

谁能帮我解决这个问题。谢谢

【问题讨论】:

    标签: javascript jquery html css canvasjs


    【解决方案1】:

    您可以通过在将鼠标悬停在另一个图表上时隐藏图表的工具提示来做一个简单的 JQuery 技巧。

    类似:

    $("#pieContainer").hover(function(){
            $("#doughnutContainer .canvasjs-chart-tooltip").hide();
        }
    );
    

    Updated jsFiddle

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-03-07
      • 1970-01-01
      相关资源
      最近更新 更多