Tworzę finansowy wykres kołowy za pomocą HighCharts, który reprezentuje alokację aktywów. Moim celem jest stworzenie wykresu przedstawiającego rzeczywiste wartości alokacji w każdym wycinku, ale wewnątrz każdego slajdu będzie widoczna zasadniczo druga etykieta danych, która wyświetla docelowy procent dla różnych pojazdów inwestycyjnych. Należy zauważyć, że alokacja bieżących aktywów może nie zawsze odpowiadać docelowej wartości alokacji.

Wszystko działało, z wyjątkiem etykiet Target wewnątrz każdego slajdu. Zobacz poniższy obrazek, co chciałbym osiągnąć:

Oto, co mam do tej pory:

            var asset_allocation_pie_chart = new Highcharts.Chart({
            chart: { renderTo: 'asset_allocation_bottom_left_div' },
            title: { text: 'Current Asset Allocation', style: { fontSize: '17px', color: entity_color, fontWeight: 'bold', fontFamily: 'Verdana'} },
            subtitle: { text: '(As of ' + effective_date_formatted + ')', style: { fontSize: '15px', color: entity_color, fontFamily: 'Verdana', marginBottom: '10px' }, y: 40 },
            tooltip: { pointFormat: '{series.name}: <b>{point.percentage}%</b>', percentageDecimals: 0 },
            plotOptions: {
                pie: { allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: true, color: '#000000', connectorWidth: 1, connectorColor: '#000000', formatter: function() { return '<b>' + this.point.name + '</b>:<br/> ' + Math.round(this.percentage) + ' %'; } } }
            },
            series: [{
                type: 'pie',
                name: 'Asset Allocation',
                data: [['Investment Grade Bonds', InvestmentGradeBondPercentage], ['High Yield Bonds', HighYieldBondPercentage], ['Hedged Equity', HedgedEquityPercentage], ['Global Equity', GlobalEquityPercentage], ['Cash', CashPercentage]]
            }],
            exporting: { enabled: false },
            credits: { enabled: false }
       });