tooltip - highcharts 工具提示文本对齐

标签 tooltip highcharts text-align

我使用 Highcharts 创建了一个图表。
工具提示在 FF 和 IE 中工作正常,但在 chorme 中,文本超出了框架。

我尝试使用 HTML

tooltip:
    {
     //Tried this also
    /* formatter: function()
    {
    return '' + Highcharts.dateFormat('%H:%M:%S', this.x) +'; '+ this.y;
    }, */
    useHTML: true,
    formatter: function() {
    var html="<div style='width:140px;text-align:center; direction:ltr'>"+
    Highcharts.dateFormat('%H:%M:%S', this.x) +'; '+ this.y+
    "</div>"; 
    return html;
    }

},

最佳答案

来自 Highcharts.com 的回答:

tooltip: {
        shared: true,
        useHTML: true,
        headerFormat: '<small>{point.key}</small><table>',
        pointFormat: '<tr><td style="color: {series.color}">{series.name}: </td>' +
        '<td style="text-align: right"><b>{point.y} EUR</b></td></tr>',
        footerFormat: '</table>',
        valueDecimals: 2
    },

Fiddle Here

关于tooltip - highcharts 工具提示文本对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11133469/

相关文章:

javascript - Highstock dateTimeLabelFormats 不起作用

html - 在 bootstrap 'col-md-12' 中对齐文本中心

javascript - 如何在右下角的文本框中对齐文本?

tooltip - 没有值时如何禁用 Chart JS 工具提示?

javascript - 如何使用 javascript 将工具提示添加到 svg 图形元素

php - 如何使用 Highcharts 显示数据库中的历史数据和实时数据

php - 不同日期范围的 Highcharts 图 X 轴标签

html - 对齐文本中的超链接间距

android - 如何在android jetpack compose中显示工具提示

javascript - Twitter Bootstrap Javascript - 如何仅使用工具提示库?