Question

我希望能够在向下钻取Highcharts饼图时隐藏/显示相关的DIV。

例如，我有5块馅饼和6块DIV。

我希望在没有向下钻取时显示DIV 6（称为DIVGENERAL），然后在剖面上向下钻取特定DIV部分。

例如，如果我向下钻取Account 1，我想要隐藏DIV 6并显示DIV 1，如果我向下钻取Account 4，我想隐藏{{ 1}}并显示DIV 6

我在向下钻取时能够成功隐藏 DIV 4，并在您向后钻取时显示。

如果我在向下钻取功能中指定DIV 6，它将隐藏它，但我需要能够根据已钻取的饼图部分告诉它隐藏哪个DIV上。

我创建了一个显示我约会对象的FIDDLE。

DIV

由于

Answer 1

请查看更新的小提琴代码：

http://jsfiddle.net/gqu1u940/5/

我添加了一个JS对象，用于将图表部分映射到其面板，如：

var panelMapping = {
    "Account 1": "Panel1",
    "Account 2": "Panel2",
    "Account 3": "Panel3",
    "Account 4": "Panel4",
    "Account 5": "Panel5"
  }

并且在drilldown:事件处理程序中，我们可以将哪个部分打包为：

drilldown: function(e) {
    alert('Drill Down : ' + e.point.name);
    var associatedPanelId = panelMapping[e.point.name];
    document.getElementById(associatedPanelId).style.display = "block";
    document.getElementById('Panel6').style.display = "none";
},
drillup: function(e) {
    alert('Drill Up');
    var panels = document.getElementsByClassName("Panel");
    for (var i = 0; i < panels.length; i++) {
        panels[i].style.display = 'none';
    }
    document.getElementById('Panel6').style.display = "block";
}

注意：我已将Panel类添加到Panel1到Panel5的所有面板，我正在使用drillup同时隐藏所有面板ALTER PROCEDURE dbo.YourProcedure @params VARCHAR(32), @Table1ID INT = NULL OUTPUT AS BEGIN SET NOCOUNT ON; BEGIN TRANSACTION; INSERT dbo.Table1... SET @Table1ID = SCOPE_IDENTITY(); INSERT dbo.Table2... COMMIT TRANSACTION; END GO IAuthenticationSessionStore 1}}事件

在Highcharts中向下钻取时隐藏/显示DIV

1 个答案: