如何使用 Jquery Highcharttable 柱形图格式化数据标签

How to format data labels with Jquery Highcharttable column charts

本文关键字：格式化数据 标签 柱形图 Highcharttable 何使用 Jquery      更新时间：2023-09-26

目前，数据标签将显示在柱形图中包含的列中。我想知道是否有人知道如何改变这些标签的位置。我以为它会像这样完成，但我无法改变任何东西。我更改了颜色，但无法让数据标签更改位置。

它目前看起来像这样：https://i.stack.imgur.com/iN6SS.jpg

$('#hidden-highchart-table').bind('highchartTable.beforeRender', function (event, highChartConfig) {
                highChartConfig.colors = ['#6d9dd2', '#6fb1b8', '#6d8547', '#eea032', '#ba3c3c',   '#492970', '#f28f43', '#77a1e5', '#c42525', '#a6c96a'];
                highChartConfig.dataLabels = {
                    verticalAlign: 'middle',
                y: 45};
            }).highchartTable();

dataLables 位于 plotOptions.series 中，不在顶层。 因此，您应该设置：

    plotOptions: {
        series: {
            dataLabels: {
                enabled: true,
                verticalAlign:'top'
            }
        }
    },

我不知道你的 highChartConfig 的其余部分是什么样子的，所以你要确保你没有覆盖整个 plotOpions 对象。

感谢您的所有帮助，我最终弄清楚了如何解决此问题。你可以利用这个函数，使用 Jquery HighChart Tables 插件访问 dataLabels 对象。

$('#hidden-highchart-table').bind('highchartTable.beforeRender', function (event, highChartConfig) {
            highChartConfig.plotOptions.series.dataLabels = {blah: blah, blah2: blah2}; 
        }).highchartTable();

在此函数中，您可以执行在普通Highcharts API中完成的任何自定义，只是语法在访问对象及其属性的方式上略有不同。

相关文章：