Проблема масштабного графика Highcharts

Question

Я использую Highcharts для создания диаграммы:

http://dev.speechlink.co.uk/David/sixthiteration/home.php

Однако при масштабировании кажется, что часть правой части диаграммы отсекается ... Я не совсем уверен, почему ..?

Вот мой код:

JQuery:

chart = new Highcharts.Chart({
      chart: {
         renderTo: 'summarycontainer',
      },
      credits: {
        enabled: false
      },
      exporting: {
        enabled: false
      },
       title: {
        text: 'No. Entries Submitted This Month',
        style: {
             fontSize: 10
        }
      },      
      xAxis: {         
         lineWidth: 1,
         lineColor: '#999999',
         title: {
            text: 'x-axis' 
         }
      },
      yAxis: {
         title: {
            text: 'y-axis'
         },
     labels: {
        y: 2
     },
     lineWidth: 1,
         lineColor: '#999999',
         gridLineWidth: 1,
         gridLineColor: '#eaeaea', 
         startOnTick: false,
         showFirstLabel: false
      },
      tooltip: {
         shared: true               
      },
      legend: {
         enabled: false
      },
      plotOptions: {
      },
      series: [{
         type: 'scatter',
         name: '',
         data: [10, 20, 10, 20, 2, 3, 1, 9],
         lineColor:  '#f6a828',
         color: '#418ed6'
      }],
   });
});

И в моем HTML у меня есть контейнер div:

<div id = "summarycontainer" style="width: 250px; height: 250px"></div>

Answer 1

В приведенном выше коде у вас есть:

data: [10, 20, 10, 20, 2, 3, 1, 9],

и в источнике страницы указывается:

data: [10, 20, 10, 20, 2, 3, 1],

Может быть, вы думаете, что сюжет прерывает последнюю точку?

edit: Добавить: categories: ['', ''] к вашему xAxis:

xAxis: {         
         categories: ['', ''],
         lineWidth: 1,
         lineColor: '#999999',
         title: {
            text: 'x-axis' 
         }
      },

По моему мнению, есть ошибка в старших чартах.

edit 2:

Для форматирования всплывающей подсказки (ниже приведен только пример!):

tooltip: {
         formatter: function() {
                   return '<b>'+ this.series.name +'</b><br/>'+
               this.x +': '+ this.y +'°C';
         }
      },