javascript – Highcharts规范不渲染文本

我正在尝试使用Highcharts创建一个仪表.

在仪表中我想要在针尖处渲染文本,并且当针尖位置改变时文本的位置应该改变.我已经在仪表的开始位置和结束位置添加了一些文本,我需要根据针尖添加第三个文本.

你能看看,让我知道我是怎么做到的吗?

我的jsfiddle链接http://jsfiddle.net/anchika/nszqbsgx/1/

var chart = new Highcharts.Chart({
    chart: {
        type: 'gauge',renderTo: container,marginTop: -60,marginRight: 0,spacingLeft: 0,spacingBottom: 0,backgroundColor: null,},pane: {
        center: ['50%','57%'],size: '75%',startAngle: -150,endAngle: 150,background: [{
            borderColor: '#000',}],tooltip: {
        enabled: false
    },title: {
        text: null,yAxis: {
        min: 0,max: 100,title: {
            y: -20,useHTML: true,text: 'graphTitle',style: {
                fontFamily: 'Raleway',fontSize: '2em',textAlign: 'center',}
        },labels: {
            enabled: false,tickInterval: 16.66,tickWidth: 5,tickPosition: 'outside',tickLength: 10,tickColor: '#000',minorTickColor: '#000',lineColor: null,plotBands: [{
            from: 0,to: 33,color: '#00A600',// green
            outerRadius: '100%',thickness: '15%'
        }]
    },plotOptions: {
        gauge: {
            innerRadius: '90%',dial: {
                backgroundColor: 'rgba(0,0.4)',}
        }
    },credits: {
        enabled: false
    },series: [{
        data: [33],dataLabels: {
            useHTML: true,//format: gaugeFormat,//Modify here to change the radial center values
            borderWidth: 0,style:{
                fontFamily:'Raleway',fontWeight: 'normal',x: 5,tooltip: {
            enabled: false,}
    }]
     },function (chart) { // on complete
       chart.renderer.text('End Time',500,370)
        .css({
            color: '#000',fontSize: '16px'
        })
        .add();
    chart.renderer.text('Start Time',240,370)

        .css({
            color: '#000',fontSize: '16px'
        })
        .add();
});

编辑:
我想要这样的东西link

解决方法

我不确定完全理解你的问题,
请查看此 link

var chart = new Highcharts.Chart({
    chart: {
        type: 'gauge',size: '60%',series: [{
        data: [100],function (chart) { // on complete
      console.log(chart); chart.renderer.text(chart.series[0].data[0].y,140+chart.series[0].data[0].y*2,350)
        .css({
            color: '#000',fontSize: '16px'
        })
        .add();

});

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...