Highcharts列图，从数据表加载时禁用插值

Question

我使用Highcharts解析HTML表并从中生成一个列图。问题是，当我使用数字或日期，如标题，图表添加'失踪'年。

见工作实例上的jsfiddle：​​

表：

<table id="datatable"> 
<thead> 
    <tr> 
     <th></th> 
     <th>Jane</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <th>2006</th> 
     <td>3</td> 
    </tr> 
    <tr> 
     <th>2008</th> 
     <td>2</td> 
    </tr> 
    <tr> 
     <th>2009</th> 
     <td>5</td> 
    </tr> 
    <tr> 
     <th>2011</th> 
     <td>1</td> 
    </tr> 
    <tr> 
     <th>2012</th> 
     <td>2</td> 
    </tr> 
</tbody> 
</table> 

而且配置：

$('#container').highcharts({ 
    data: { 
     table: 'datatable' 
    }, 
    chart: { 
     type: 'column' 
    }, 
    yAxis: { 
     allowDecimals: false, 
     title: { 
      text: 'Units' 
     } 
    }, 
    plotOptions: { 
     series: { 
     connectNulls: false 
     } 
    } 
}); 

我试着使用connectNulls: false但它没有任何效果。

有没有让2007年和2010年未出现在图表中的设置？我希望图表只使用HTML中的数据并且不使用插值或任何东西。

我希望你能帮忙！谢谢！

约翰

Answer 1

我已经找到了解决方案，使用complete回调修改名称和与名称来填充xAxis.categories：

参见：http://jsfiddle.net/ng2yvq4o/2/

$('#container').highcharts({ 
    data: { 
     table: 'datatable', 
     /** 
     * Modify generated settings 
     */ 
     complete: function (settings) { 
      // We are going to create categories from each item in the series 
      settings.xAxis = { 
      categories: [] 
      }; 
      settings.series.map(function (series) { 
       return series.data.map(function (series_item) { 
       // Cast the item name to a string to prevent interpolation 
       series_item[0] = String(series_item[0]); 
       // Add the name to our categories: 
       settings.xAxis.categories.push(series_item[0]); 
       return series_item; 
      }); 
      }); 
     } 
    }, 
    chart: { 
     type: 'column' 
    }, 
    title: { 
     text: 'Data extracted from a HTML table in the page' 
    }, 
    yAxis: { 
     allowDecimals: false, 
     title: { 
      text: 'Units' 
     } 
    } 
}); 

我希望其他人有用于此！

Greetings， Johan