Question

以下小提琴显示了在纵向和横向之间旋转时，我的用户在手机上发生了什么。

在加载时，图表会根据需要显示。
按“步骤1”，图表会缩小并按需要显示。
单击“步骤2”，图表将恢复为原始大小，但垂直轴标签重叠。

我尝试了chart.redraw（），但是没有成功。有什么想法吗？

$(function() {
    var chart = Highcharts.chart('container', {
        chart: {
            type: 'bar',
            renderTo: 'industrybasicbar'
        },
        title: {
            text: 'All Private Industries Expected to Add Jobs by 2024'
        },

        xAxis: {
            categories: ['Health care and social assistance',   'Professional and business services',   'Trade, transportation, and utilities', 'Leisure and hospitality',  'Manufacturing',    'Construction', 'Local government', 'Financial activities', 'Other services',   'Natural resources and mining', 'Private educational services', 'State government', 'Information',  'Federal government'
    ],
            title: {
                text: null
            }
        },
        yAxis: {
            title: {
                text: null
            }
        },
        series: [{
            name: 'Projected Growth',
            data: [46300,   45700,  36200,  35800,  21100,  17600,  9600,   9100,   8800,   6100,   4700,   2800,   2000,   -1000
    ],
                    negativeColor: 'black'
        }]


});

    $('#resize').click(function () {
        chart.setSize(300, 300);
    });

    $('#resize2').click(function () {
       chart.setSize(500, 300);
    });

});

Answer 1

这似乎是错误。我在这里报告过：https://github.com/highcharts/highcharts/issues/8510

解决方法：

手动更新textOverflow：

  $('#resize').click(function() {
    chart.setSize(300, 300);
    chart.xAxis[0].update({
      labels: {
        style: {
          textOverflow: 'ellipsis'
        }
      }
    });
  });

实时演示： http://jsfiddle.net/BlackLabel/axhcwrmd/

Highcharts移动（和窗口）大小调整。轴重叠

1 个答案: