Javascript Highcharts不呈现html表中的标签

在HighCharts中-如何让标签和弹出标签引用HTML表的第一列：

我在这把小提琴上增加了：-饼图显示了正确的数字，但只是标签不起作用。我怀疑这是什么：

dataLabels: {
                enabled: true,
                color: '#000000',
                connectorColor: '#000000',
                format: '<b>{point.name}</b>: {point.percentage:.1f} %'
            }

数据标签：{
启用：对，
颜色：'#000000'，
连接器颜色：'#000000'，
格式：'{point.name}:{point.percentage:.1f}%'
}

谢谢你的帮助

标记

我的代码是：

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<table id="datatable2">
<thead>
    <tr>
        <th>Num</th>
        <th>Status Reason</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Client Action Required</td>
        <td>64</td>
    </tr>
    <tr>
        <td>Future Enhancement</td>
        <td>8</td>
    </tr>
    <tr>
        <td>Client Hold</td>
        <td>3</td>
    </tr>
    <tr>
        <td>Monitoring</td>
        <td>11</td>
    </tr>
</tbody>
</table>

<div id="container" style="min-width: 400px; height: 500px; margin: 0 auto"></div>

号码
身份原因
要求客户采取行动
64
未来增强
8.
客户持有
3.
监测
11

我的Javascript是：

    $(function () {
    $('#container').highcharts({
        data: {
            table: document.getElementById('datatable2')
        },
        chart: {
            type: 'pie'
        },
        title: {
            text: 'Queue by Person and Status'
        },

        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        }

        , plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                }
            }
        }
    });
});

$（函数（）{
$（“#容器”）。高图({
数据：{
表：document.getElementById（'datatable2'）
},
图表：{
键入：“馅饼”
},
标题：{
文本：“按人员和状态排队”
},
工具提示：{
pointFormat:“{series.name}:{point.percentage:.1f}%”
}
，打印选项：{
馅饼：{
allowPointSelect:true，
光标：“指针”，
数据标签：{
启用：对，
颜色：'#000000'，
连接器颜色：'#000000'，
格式：'{point.name}:{point.percentage:.1f}%'
}
}
}
});
});

要解决名称问题，请使用javascript生成数据数组，然后创建highchart

检查以下JSFIDLE，它以您期望的方式工作并使用您的表

它在javascript中动态构建数据数组，然后生成图表

我在Javascript的

第58行添加了
图例
，如果不需要，请删除该行（您也可以单击图例名称以在图表中添加/删除它们）

我还建议查看高图文档：

它有很好的文档记录，如果遇到任何问题，都有您需要的一切

此外，您还可以通过在页面顶部添加以下内容来删除“highcharts.com”

// By default.. ALL charts should not show the credits (if you want)
Highcharts.setOptions({credits: {enabled: false}});

：）
非常感谢@JustAnil-Mark