Question

之前我问我的问题是我的问题 http://jsfiddle.net/woon123/9155d4z6/1/

  $(document).ready(function () {
      $('#deal_venue_chart').highcharts({
          chart: {
              type: 'column'
          },
          credits: {
              enabled: false
          },
          title: {
              text: 'Popularity of Deals in Venues'
          },
          subtitle: {
              text: 'Redemption Count'
          },
          yAxis: {
              allowDecimals: false,
              min: 0,
              title: {
                  text: 'Number of Redeems'
              }
          },
          scrollbar: {
              enabled: true
          },
          plotOptions: {
              series: {
                  dataLabels: {
                      enabled: true,
                      align: 'center',
                      color: '#000000',
                      overflow: 'justify',
                      crop: true
                  },
                  pointWidth: 150
              }
          },
          xAxis: {
              min: 0,
              max: 0,
              type: 'category'
          },
          legend: {
              layout: 'vertical',
              align: 'right',
              verticalAlign: 'top',
              y: 30
          },
          series: [{
              name: '<span style="color: #00910c">Active: </span>' + '1 Free Soju Cocktails for every Main Meal Purchased',
              data: [{
                  name: "Deals",
                  y: 718,
                  drilldown: "1 Free Soju Cocktails for every Main Meal Purchased" + " active",
                  dataLabels: {
                      format: "1 Free Soju Cocktails for every Main Meal Purchased"
                  }
              }]
          }, {
              name: '<span style="color: #00910c">Active: </span>' + '4pcs Fried Chicken @ $8.00',
              data: [{
                  name: "Deals",
                  y: 746,
                  drilldown: "4pcs Fried Chicken @ $8.00" + " active",
                  dataLabels: {
                      format: "4pcs Fried Chicken @ $8.00"
                  }
              }]
          }, {
              name: '<span style="color: #00910c">Active: </span>' + '50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!',
              data: [{
                  name: "Deals",
                  y: 365,
                  drilldown: "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!" + " active",
                  dataLabels: {
                      format: "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!"
                  }
              }]
          },

          {
              id: "1 For 1 Chicken Up Wings and Korean Bingsu" + ' (Redemption Count)',
              name: '<span style="color: #df1007">Expired: </span>' + '1 For 1 Chicken Up Wings and Korean Bingsu',
              data: [{
                  name: "Deals",
                  y: 1039,
                  drilldown: "1 For 1 Chicken Up Wings and Korean Bingsu" + " past",
                  dataLabels: {
                      format: "1 For 1 Chicken Up Wings and Korean Bingsu"
                  }
              }],
              visible: false
          }, ],
          drilldown: {
              series: [{
                  name: "Venues",
                  id: "1 Free Soju Cocktails for every Main Meal Purchased" + " active",
                  data: [
                      [
                          "Chicken Up @ Jurong East", 310],
                      [
                          "Chicken Up @ Tampines", 171],
                      [
                          "Chicken Up @ Tanjong Pagar", 237], ]
              }, {
                  name: "Venues",
                  id: "4pcs Fried Chicken @ $8.00" + " active",
                  data: [
                      [
                          "Chicken Up @ Jurong East", 242],
                      [
                          "Chicken Up @ Tampines", 337],
                      [
                          "Chicken Up @ Tanjong Pagar", 167], ]
              }, {
                  name: "Venues",
                  id: "50% OFF Ganjang, Yanguyum Wings and Soju Cocktails!" + " active",
                  data: [
                      [
                          "Chicken Up @ Jurong East", 69],
                      [
                          "Chicken Up @ Tampines", 132],
                      [
                          "Chicken Up @ Tanjong Pagar", 164], ]
              },

              {
                  name: "Venues",
                  id: "1 For 1 Chicken Up Wings and Korean Bingsu" + " past",
                  data: [
                      [
                          "Chicken Up @ Jurong East", 381],
                      [
                          "Chicken Up @ Tampines", 214],
                      [
                          "Chicken Up @ Tanjong Pagar", 444], ]
              },

              ]
          }
      });
  });

我有两个问题希望可以回答。

首先，在我深入研究之前，我只有一个系列，而我正在尝试使该单个系列可滚动。但是，它没有成功。我的整个系列仍然被压在一起，这是我想要避免的。另外，由于我将增加列数，因此无法为列设置较小的尺寸以适应。

我的第二个问题是，据我所知，我需要声明x轴min和max才能使滚动条工作。在我深入研究之前，只有一个系列，所以min和max都是0.然而，在我钻研之后，我可能会得到3个或更多系列。在这种情况下，我的min应为0，而max应为2.如何更改min和max？我知道这样的代码可以帮助在钻取和钻取的情况下更改图表的标题，如下所示

  chart: {
      type: 'column',
      events: {
          drilldown: function (e) {
              this.setTitle({text: "Popularity of Deal of Deal Type " + e.point.name});
          },
          drillup: function (e) {
              this.setTitle({text: 'Popularity of Deal Types'});
          }
      }
  }

但是，我似乎无法找到帮助改变x轴最小值和最大值的函数。

感谢您的帮助，谢谢！

Answer 1

1）如果您需要滚动类别，请设置最小/最大值，然后为每个点定义单独的x。在你的例子中，你拥有同一只猫的所有积分。

2）在drilldown / drillup事件中，您可以致电setExtremes。

Highchart：使单个系列可滚动并在向下钻取时更改x轴变量

1 个答案: