Positioning each tooltip in highchart

廉价感情. 提交于 2019-12-13 10:26:51

问题


I'm using Highchart library for creating variablepie chart.

I have a few questions about using that library:

  1. Is it possible to position the tooltip for each section?
  2. Inside the tooltip box, I need to align value "float-right". Is it possible? 3. Is it possible to change height of tooltip box and cursor pointer?

URL: https://jsfiddle.net/BlackLabel/eom8tqns/

  tooltip: {
    headerFormat: '',
    padding: 0,
    pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> 
    {point.name}</b><br/>' +
        'Area (square km): <b>{point.y}</b><br/>' +
        'Population density (people per square km): <b>{point.z}</b><br/>'
},

回答1:


To align values right and change the height of the tooltip set appropriate CSS styles:

.highcharts-tooltip {
  text-align: right;
}

.highcharts-tooltip > span {
  height: 100px;
}

The cursor can be set in series properties:

series: [{
  cursor: 'pointer',
  data: data
}]

Demo:

  • https://jsfiddle.net/BlackLabel/v2txyp6h/

API reference:

  • https://api.highcharts.com/highcharts/series.line.cursor


来源:https://stackoverflow.com/questions/56179841/positioning-each-tooltip-in-highchart

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!