Highchart列不向下鑽取

Question

您好我創建了一個列highchart如下圖所示

http://jsfiddle.net/woon123/Lgehd2mb/1/

$(function() { 
    $('#venue_chart').highcharts({ 
     credits: { 
      enabled: false 
     }, 
     title: { 
      text: 'Popularity of Venues' 
     }, 
     subtitle: { 
      text: 'View and Redemption Count' 
     }, 
     yAxis: { 
      allowDecimals: false, 
      min: 0, 
      title: { 
       text: 'Number of Users' 
      } 
     }, 
     xAxis: { 
      categories: [ 
       "Chicken Up @ Jurong East", 
       "Chicken Up @ Tanjong Pagar", 
       "Chicken Up @ Tampines", ] 
     }, 
     labels: { 
      items: [{ 
       style: { 
        left: '50px', 
        top: '18px', 
        color: (Highcharts.theme && Highcharts.theme.textColor) || 'black' 
       } 
      }] 
     }, 
     chart: { 
      type: 'column' 
     }, 
     series: [{ 
      name: 'View Count', 
      data: [{ 
       y: 370, 
       drilldown: "Chicken Up @ Jurong East" + " view" 
      }, { 
       y: 410, 
       drilldown: "Chicken Up @ Tanjong Pagar" + " view" 
      }, { 
       y: 370, 
       drilldown: "Chicken Up @ Tampines" + " view" 
      }, ] 
     }, { 
      name: 'Redemption Count', 
      data: [{ 
       y: 224, 
       drilldown: "Chicken Up @ Jurong East" + " redeem" 
      }, { 
       y: 254, 
       drilldown: "Chicken Up @ Tanjong Pagar" + " redeem" 
      }, { 
       y: 224, 
       drilldown: "Chicken Up @ Tampines" + " redeem" 
      }, ] 
     }], 
     drilldown: { 
      series: [{ 
       name: "Chicken Up @ Jurong East" + " view", 
       id: "Chicken Up @ Jurong East" + " view", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 50], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 30], 
        [ 
         "Soju Cocktails at $17.00", 50], 
        [ 
         "4pcs Fried Chicken @ $8.00", 20], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 10], 
        [ 
         "12345678", 210], ] 
      }, { 
       name: "Chicken Up @ Jurong East" + " redeem", 
       id: "Chicken Up @ Jurong East" + " redeem", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 40], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 20], 
        [ 
         "Soju Cocktails at $17.00", 40], 
        [ 
         "4pcs Fried Chicken @ $8.00", 15], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 8], 
        [ 
         "12345678", 101], ] 
      }, { 
       name: "Chicken Up @ Tanjong Pagar" + " view", 
       id: "Chicken Up @ Tanjong Pagar" + " view", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 50], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 30], 
        [ 
         "Soju Cocktails at $17.00", 50], 
        [ 
         "4pcs Fried Chicken @ $8.00", 20], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 10], 
        [ 
         "Early Bird 20% Off Bill", 40], 
        [ 
         "12345678", 210], ] 
      }, { 
       name: "Chicken Up @ Tanjong Pagar" + " redeem", 
       id: "Chicken Up @ Tanjong Pagar" + " redeem", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 40], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 20], 
        [ 
         "Soju Cocktails at $17.00", 40], 
        [ 
         "4pcs Fried Chicken @ $8.00", 15], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 8], 
        [ 
         "Early Bird 20% Off Bill", 30], 
        [ 
         "12345678", 101], ] 
      }, { 
       name: "Chicken Up @ Tampines" + " view", 
       id: "Chicken Up @ Tampines" + " view", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 50], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 30], 
        [ 
         "Soju Cocktails at $17.00", 50], 
        [ 
         "4pcs Fried Chicken @ $8.00", 20], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 10], 
        [ 
         "12345678", 210], ] 
      }, { 
       name: "Chicken Up @ Tampines" + " redeem", 
       id: "Chicken Up @ Tampines" + " redeem", 
       data: [ 
        [ 
         "Yangpa Bomb Introductory Promo", 40], 
        [ 
         "1 For 1 Chicken Up Wings and Korean Bingsu", 20], 
        [ 
         "Soju Cocktails at $17.00", 40], 
        [ 
         "4pcs Fried Chicken @ $8.00", 15], 
        [ 
         "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!", 8], 
        [ 
         "12345678", 101], ] 
      }, ] 
     } 
    }); 
}); 

我的問題是，我不能讓鑽到工作。

我按照這裏的說明Highcharts xAxis drilldown dont change correctly但它仍然無法正常工作。

任何人都可以引導我沿着這件事嗎？謝謝！

Answer 1

您需要添加drilldown.js參考

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

JSFiddle demo