How to add Modal pop up on nodes of org chart Highcharts(如何在组织结构图HighChart节点上添加模态弹出窗口)

本文介绍了如何在组织结构图HighChart节点上添加模态弹出窗口的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在处理一个HighChart页面，在该页面中，当我单击组织结构图的节点时，需要显示我的数据。 我可以通过单击节点来显示数据，但这只是一个工具提示。我的要求是需要显示数据的节点单击，但这应该是一个模式弹出。 以下是我的代码

[https://jsfiddle.net/BlackLabel/2e83ngw1/]

推荐答案

而不是使用工具提示，您可以创建自己的弹出窗口元素，用点信息更新它，并在点的事件中显示/隐藏它。

point: {
  events: {
    click: function() {
      const popup = document.getElementById('popup');

      popup.innerHTML = this.info;
      popup.style.display = 'block';

    },
    mouseOut: function() {
      const popup = document.getElementById('popup');
      popup.style.display = 'none';
    }
  }
}

实时演示：https://jsfiddle.net/BlackLabel/dhaysfqz/

接口参考：https://api.highcharts.com/highcharts/series.organization.point.events

这篇关于如何在组织结构图HighChart节点上添加模态弹出窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！