javascript - HTML データ テーブルの縦棒グラフとスプライン グラフを組み合わせたハイチャート

Question

最初のシリーズを列として表示し、2 番目のシリーズをスプラインとして表示することは可能ですか? HTML テーブル ベースの HighCharts チャートで?

例えば。次のリンク: http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-parsed/ - 2 つのデータ系列を示します。しかし、どちらも列です。最初のコードを列として、2 番目のコードをスプラインとして表示するには、以下のコードをどのように変更すればよいでしょうか?

$(function () {
$('#container').highcharts({
    data: {
        table: document.getElementById('datatable')
    },
    chart: {
        type: 'column'
    },
    title: {
        text: 'Data extracted from a HTML table in the page'
    },
    yAxis: {
        allowDecimals: false,
        title: {
            text: 'Units'
        }
    },
    tooltip: {
        formatter: function() {
            return '<b>'+ this.series.name +'</b><br/>'+
                this.y +' '+ this.x.toLowerCase();
        }
    }
});
});

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

<table id="datatable">
<thead>
    <tr>
        <th></th>
        <th>Jane</th>
        <th>John</th>
    </tr>
</thead>
<tbody>
    <tr>
        <th>Apples</th>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr>
        <th>Pears</th>
        <td>2</td>
        <td>0</td>
    </tr>
    <tr>
        <th>Plums</th>
        <td>5</td>
        <td>11</td>
    </tr>
    <tr>
        <th>Bananas</th>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <th>Oranges</th>
        <td>2</td>
        <td>4</td>
    </tr>
</tbody>
</table>

ありがとうございました、

マーク