Highcharts 从轴标签上的鼠标上方或从序列点在浮动div上生成highchart实例

我一直在旧的论坛帖子或API上寻找它，但找不到任何解决方案。我正在尝试从序列点或轴标签在鼠标上方/单击事件上显示一个新图表，如工具提示。 首先，我找到了一些对highslide的引用，但我无法使它在我的项目依赖项上工作。 然后我尝试从系列点使用

mouseOver

，但是

e

listener不返回

screenX

或

screenY

，只单击事件侦听器返回。因此，我发现来自black label的

custom events.js

，在鼠标悬停事件上也没有成功。所以我现在使用点击，现在我也在努力定义不同的图表高度。我通过

chart.height

设置它，但它似乎忽略了它，我在一个页面上创建了多个图表，从另一个js文件调用构造函数

---

另一个想法是在工具提示中绘制图表，但我找不到任何演示或相关主题。

请看这个示例，它显示了如何将图表呈现为工具提示中突出的HTML元素

演示：

工具提示：{
是的，
pointFormatter:函数（）{
var data=[this.x，this.y，this.z]；
setTimeout（函数（）{
海图。海图（‘海图’{
标题：{
文本：“”
},
图例：{
已启用：false
},
学分：{
已启用：false
},
系列：[{
动画：错，
数据：数据
}],
亚克斯：{
标题：“”
},
xAxis：{
类别：['x'，'y'，'z']
}
})
}, 10);
返回“”；
}
}

  tooltip: {
    useHTML: true,
    pointFormatter: function() {
      var data = [this.x, this.y, this.z];
      setTimeout(function() {
        Highcharts.chart('chart', {
          title: {
            text: ''
          },
          legend: {
            enabled: false
          },
          credits: {
            enabled: false
          },
          series: [{
            animation: false,
            data: data
          }],
          yAxis: {
            title: ''
          },
          xAxis: {
            categories: ['x', 'y', 'z']
          }
        })
      }, 10);
      return '<div id="chart" style="width: 100px; height: 150px;"></div>';
    }
  }