0

这些图表我已经建立了几个月，而就在今天，图例的样式似乎已经向左移动了大约 150 像素。它们刚刚从饼图中右对齐，但现在直接呈现在饼图的顶部，我无法弄清楚为什么。我可以使用边距和填充将内联样式添加到我正在创建的 div 中，但这并不能证明图例上与每个饼图对应的彩色框是合理的。我的代码/样式没有改变，我相信这是一个功能问题。这是我的代码；任何帮助表示赞赏。

var options = {
        chart:{type:'pie',
            renderTo: 'ctl00_ContentPlaceHolder1_Overview1_AssetCategoryChart',
              events: {
                load: function(event) {
                $('#ctl00_ContentPlaceHolder1_Overview1_AssetCategoryChart .highcharts-legend-item').last().append('<br/><div style="width: 200px; margin-left: 170px; height: 2px;">_____</div><br/><div style="width:200px; height: 10px;"><span style="float:right"><b>100%</b></span> </div>');                    
                }
              },
            spacingTop: 0,
            marginTop: 0                  
            },
        credits:{enabled: false},
        colors:[
            '#5485BC', '#AA8C30', '#5C9384', '#981A37', '#FCB319',     '#86A033', '#614931', '#00526F', '#594266', '#cb6828', '#aaaaab', '#a89375'
            ],
        title:{text: null},
        tooltip:{
            enabled: true,
            animation: true,
            formatter: function(){
                return this.point.name + '<br/>' + this.y.toFixed(2) + '%';
            }
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                animation: true,
                cursor: 'pointer',
                showInLegend: true,
                dataLabels: {
                    enabled: false,                        
                    formatter: function() {
                        return this.y.toFixed(2) + '%';
                    }
                }                                   
            }
        },
        legend: {
            enabled: true,
            layout: 'vertical',
            align: 'right',
            width: 200,
            verticalAlign: 'top',
            borderWidth: 0,
            useHTML: true,
            itemMarginBottom: 4,
            labelFormatter: function() {
                return '<div style="width:180px; margin-left: 150px;"><span style="float:left">' + this.name + '</span><span style="float:right">' + this.y.toFixed(2) + '%</span></div>';
            },
            title: {
                text: 'Category',
                style: {
                    fontWeight: 'bold'
                }
            }
        },
        series: [{
            type: 'pie',
            dataLabels:{

            },
            data: [
                ['Real Estate', 12.55],
                ['Large-Cap Growth', 12.34],
                ['Foreign Large-Cap Blend', 12.19],
                ['Large-Cap Value', 7.51],
                ['Emerging Markets', 6.51],
                ['Health',5.59],
                ['Cash Equivalents',5.23],
                ['Foreign Large-Cap Value',4.02],
                ['Large-Cap Blend',3.95],
                ['World Allocation',3.55],
                ['Mid-Cap Growth',3.29],
                ['Remaining', 23.30]
            ]
        }]
    }
4

0 回答 0