ハイチャートを使用して全体のデータラベルをレンダリングする方法は？

Question

データラベルの変数targetsの表示に問題があります。 何らかの理由により、シリーズデータラベルにはtargetsAdj値のみが表示されます。 y軸に積み重ねられたラベルを追加しようとしましたが、動作しませんでした。どのようにこれを行うことができますか？

ar targets = [<?php echo $gg[0][24].",".$gg[0][20].",".$gg[0][26].",".$gg[0][22].""; ?>], 
mcbf = [ <?php echo $gg[0][16].",".$gg[0][17].",".$gg[0][18].",".$gg[0][19].""; ?>], 
targetsAdj = [], 
attagg=[], 
calc, 
calc2; 
for (var i=0;i<targets.length;i++) { 
    calc = targets[i] >= mcbf[i] ? targets[i] - mcbf[i] : 0; 
    targetsAdj.push(calc); 
} 
for (var i=0;i<mcbf.length;i++) { 
    calc2 = (mcbf[i]/targets[i])>=0.7 ? {y:mcbf[i],color:'#1de9b6',borderColor:'#00bfa5'} : ((mcbf[i]/targets[i])>=0.4 ? {y:mcbf[i],color:'#ffeb3b',borderColor:'#fdd835'}:{y:mcbf[i],color:'tomato',borderColor:'#d84315'}); 
    attagg.push(calc2); 
} 
$('#attivazioni').highcharts(
{ 
    "colors": 
    ["tomato" 
    , "lime" 
    , "rgba(139,188,33,.5)" 
    , "rgba(145,0,0,.5)" 
    , "rgba(26,173,206,.5)" 
    , "rgba(73,41,112,.5)" 
    , "rgba(242,143,67,.5)" 
    , "rgba(119,161,229,.5)" 
    , "rgba(196,37,37,.5)" 
    , "rgba(166,201,106,.5)"], 

    "chart": { 
    "zoomType": "x", 
    "showAxis": true, 
    "alignTicks": true, 
//"height": 300, 
"style": { 
    "fontFamily": "Helvetica, Arial, sans-serif", 
    "color": "#333" 
}, 
"backgroundColor": "#ffffff" 
}, 
"title": { 
    "text": " " 
}, 
"xAxis": [{ 
    "tickmarkPlacement": "on", 
    "labels": { 
    "style": { 
     "fontSize": "10px", 
     "color": "#333" 
    }, 
    "useHTML": true 
    }, 
    "gridLineColor": "lightgrey", 
    "gridLineWidth": 0, 
    "categories": ["<span style=\"font-size:12px\"><b>Lead</span>" 
    , "<span style=\"font-size:12px\"><b>Lvc</span>" 
    , "<span style=\"font-size:12px\"><b>Push</span>" 
    , "<span style=\"font-size:12px\"><b>AddOn</span>"] 
}], 
"yAxis": [{ 
    "alternateGridColo": "null", 
    "minorTickInterval": "auto", 
    "lineColor": '#000', 
    "tickWidth": "1", 
    "tickColor": '#000', 
    "gridLineColor": "#C0C0C0", 
    "gridLineWidth": 1, 
    "lineColor": "#C0C0C0", 
    "lineWidth": 1, 
    "endOnTick": true, 
    "min": 0, 
    "labels": { 
    "formatter": function() { 
     return '%' + this.axis.defaultLabelFormatter.call(this); 
    } , 
    "style": { 
     "fontSize": "10px", 
     "color": "black" 
    } 
    }, 
    stackLabels: { 
    enabled: true, 
    style: { 
     fontWeight: 'bold', 
     color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' 
    }, 
    formatter: function() { 
     return Highcharts.numberFormat(this.total, 2, ','); 
    } 
    }, 
    title: { 
    text: '', 
    style: { 
     display: 'none' 
    } 
    }, 
    subtitle: { 
    text: '', 
    style: { 
     display: 'none' 
    } 
    }, 
}], 
"legend": { 
    "enabled": false 
}, 
"navigation": { 
    "buttonOptions": { 
    "enabled": false 
    } 
}, 
"plotOptions": { 
    "series": { 
    "dataLabels": { 
     "enabled": true, 
     "style": { 
     "color": "#333" 
     }, 
     "crop": false, 
     "overflow": "none" 
    }, 
    "shadow": false, 
    "marker": { 
     "enabled": false 
    } 
    }, 
    "column": { 
    "grouping": false, 
    "stacking": "percent", 
    "shadow": false 
    } 
}, 
"credits": { 
    "enabled": false 
}, 
"tooltip": { 
    "enabled": false, 
    "shared": true, 
    "valueDecimals": 0 
}, 
"series": [{ 
    "name": "Target", 
    "type": "column", 
    "color": "rgba(140, 131, 131, 0.49)", 
    "borderColor": "#B0BEC5", 
    "borderWidth": 2, 
    "data": targetsAdj, 
    "dataLabels": { 
    y:-18, 
    verticalAlign:'top', 
    "formatter": function() { 
     if (this.series.index == 0) return targets[this.point.x]; 
     else return this.y; 
    } 
    } 
},{ 
    "name": "SELLS", 
    "type": "column", 
    "data": attagg, 
    "color": "#1de9b6", 
    "borderColor": "grey", 
    "borderWidth": 2, 
    "zIndex": 10 
} ] 
}); 

Answer 1

私はfalseにシリーズdatalabelsを設定することで解決しました。 y軸設定を次のように変更します。

yAxis: { 
    min: 0, 
    max: 105, 
    endOnTick: false, 
    title: { 
    text: null 
    }, 
    stackLabels: { 
enabled: true, 
style: { 
    fontWeight: 'bold', 
    color: 'black' 
} 
} 
},