Highcharts 如何将文本对齐中心特性应用于highchart自定义标签

Highcharts 如何将文本对齐中心特性应用于highchart自定义标签,highcharts,highstock,Highcharts,Highstock,已尝试将文本对齐:居中属性应用于highchart中的标签,但无法,也不知道如何进行 小提琴: HTML <script src="https://code.highcharts.com/highcharts.js"></script> <script src="https://code.highcharts.com/highcharts-more.js"></script> <script src="https://code.highcha

已尝试将文本对齐:居中属性应用于highchart中的标签,但无法,也不知道如何进行

小提琴:

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="width: 100%; height: 400px; margin: 0 auto">
</div>

JS

Highcharts.chart('容器'{

chart: {
    type: 'gauge',
    plotBorderWidth: 1,        
    plotBackgroundImage: null

},
labels: {               
        items: [{
            html: '<span style="text-align:center;">My custom label</span><br><span style="text-align:center;">My Label Data<br>Another Label Data<br>How to apply text align:center property those text</span>',
            style: {
                left: "195px",
                top: "210px"

            }
        },{
               html: '<span style="text-align:center;">My custom label</span><br><span style="text-align:center;">My Label Data<br>Another Label Data<br>How to apply text align:center property those text</span>',
            style: {
                left: "550px",
                top: "210px"
            }
        },{
               html: '<span style="text-align:center;">My custom label</span><br><span style="text-align:center;">My Label Data<br>Another Label Data<br>How to apply text align:center property those text</span>',
            style: {
                left: "900px",
                top: "210px"
            }
        }]
    }


});
图表:{
类型:“仪表”,
打印边框宽度:1,
plotBackgroundImage:空
},
标签:{
项目:[{
html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:“195px”, 顶部:“210px” } },{ html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:“550px”, 顶部:“210px” } },{ html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:“900px”, 顶部:“210px” } }] } });
使用
style=“text-anchor:middle”
更新html,并使用span标记中断

html: '<span style="text-anchor:middle">My custom label</span><br><span style="text-anchor:middle">My Label Data</span><br><span style="text-anchor:middle">Another Label Data</span><br><span style="text-anchor:middle">How to apply text align:center property those text</span>',
html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”,
Highcharts.chart('container'{
图表:{
类型:“仪表”,
打印边框宽度:1,
plotBackgroundImage:空,
},
标签:{
项目:[{
html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:1000/5, 顶部:“210px” } },{ html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:1000/2, 顶部:“210px” } },{ html:“我的自定义标签
我的标签数据
另一个标签数据
如何应用文本对齐:居中属性这些文本”, 风格:{ 左:1000/1.26, 顶部:“210px” } }] }, 标题:{ 正文:“与目标值的偏差
2018年1月24日至2017年2月7日” }, 窗格:[{ startAngle:-90, 端角:90, 背景:空, 中心:['20%,'50%,], 尺码:250 }, { startAngle:-90, 端角:90, 背景:空, 中心:['50%,'50%'], 尺码:250 }, { startAngle:-90, 端角:90, 背景:空, 中心:['80%,'50%,], 尺码:250 }], 工具提示:{ 已启用:true }, 亚克斯:[{ 最低:6.5, 最高:11, 标签:{ 旋转:“自动” }, 绘图带:[{ 起始日期:6.5, 致:7.5, 颜色:“红色” },{ 起始日期:7.5, 致:8,, 颜色:“黄色” },{ 起:8,, 致:8.5, 颜色:“绿色” },{ 从:8.5, 致:9.5, 颜色:“黄色” },{ 从:8.5, 致:11,, 颜色:“红色” }], 窗格:0, 标题:{ 文本:“”, y:-0 } }, { 民:9,, 最高:27, minorTickPosition:“内部”, 位置:'内部', 标签:{ 旋转:“自动” }, 绘图带:[{ 起:9,, 致:12,, 颜色:“红色” },{ 起:12,, 致:13, 颜色:“黄色” },{ 起:13,, 致:14, 颜色:“绿色” },{ 起:14,, 致:15,, 颜色:“黄色” },{ 起:15, 致:27, 颜色:“红色” }], 窗格:1, 标题:{ 文字:“gm/cm2”, y:-0 } },{ 民:4,, 最高:7.6, minorTickPosition:“内部”, 位置:'内部', 标签:{ 旋转:“自动” }, 绘图带:[{ 发信人:4,, 致:4.8, 颜色:“红色” },{ 起始日期:4.8, 致:5.1, 颜色:“黄色” },{ 起始日期:5.1, 致:5.5, 颜色:“绿色” },{ 起始日期:5.5, 至:6.5, 颜色:“黄色” },{ 起始日期:6.5, 致:7.6, 颜色:“红色” }], 窗格:2, 标题:{ 文本:“”, y:-0 } }], 打印选项:{ 仪表:{ 数据标签:{ 已启用:true }, 拨号:{ 半径:“100%” } } }, 系列:[{ 名称:“A频道”, 数据:[7.5], 雅克斯:0 }, { 名称:“B频道”, 数据:[18], 亚克斯:1 },{ 名称:“c频道”, 数据:[5.5], 亚克斯:2 }] });


需要什么样的输出,在上面的snipet中添加示例imageimage检查此项。请参考css中的PropertyAnna-align,如“text-align:center;”属性此代码段左对齐不客气:)