javascript - Highcharts 删除第一个条之前和最后一个之后的空格

标签 javascript highcharts

我正在尝试删除此图表顶部和底部的空间 http://jsfiddle.net/bfa1o0ar/7/ 。它是第一个小节之前和最后一个小节之后的间距。我尝试过删除填充、边距等。

$(function() {
  Highcharts.chart('container', {
    chart: {
        marginTop: 0,
      marginBottom: 0,
      spacingTop: 0,
      spacingBottom: 0,
      type: 'bar',
      title: {
        text: ''
      }
    },
    credits: {
      enabled: false
    },
    title: {
      text: null
    },
    xAxis: {
      minPadding:0,
      maxPadding:0,
        lineWidth: 0,
        gridLineWidth: 0,
      tickWidth: 0,
      tickAmount: 0,
      tickmarkPlacement: 'on',
      categories: ['1-3', '4-7', '7-10', '11-14', '15-20'],
      allowDecimals: false,
    },
    yAxis: {
      minPadding:0,
      maxPadding:0,
        lineWidth: 0,
        gridLineWidth: 0,
      endOnTick: false,
      showFirstLabel: false,
      showLastLabel: false,
      startOnTick: false,
      tickWidth: 0,
      tickAmount: 0,
      //tickmarkPlacement: 'between',
      min: 0,
      allowDecimals: false,
      title: {
        text: ''
      },
      stackLabels: {
        enabled: true,
        style: {
          fontWeight: 'bold',
          color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
        }
      }
    },
    legend: {
      enabled: false
    },
    plotOptions: {
      column: {
        groupPadding: 0,
        pointPadding: 0,
        //pointWidth: 35, // width of bar
        pointRange: 0
      },
      series: {
        pointPadding: 0.1,
        groupPadding: 0,
        borderWidth: 0,
        //pointWidth: 30,
        shadow: false,
        stacking: 'normal',
        dataLabels: {
          align: 'right',
          enabled: false,
          color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
        },
      }
    },
    series: [{
      name: 'John',
      data: [5, 3, 4, 7, 2]
    }]
  });
});

最佳答案

将 x 轴的最小值/最大值设置为第一个类别索引 + 0.1最后一个类别索引 - 0.1

  min: 0 + 0.1,
  max: 4 - 0.1
},

示例:http://jsfiddle.net/bfa1o0ar/8/

关于javascript - Highcharts 删除第一个条之前和最后一个之后的空格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41324956/

相关文章:

javascript - 使用 JEST 对 Vue.js 路由器进行单元测试 - 如何模拟页面?

javascript - 使用 "this"关键字对整个选择进行 jquery 点击事件

javascript - Highcharts:数据更新后,同步图表不再同步

php - 用单引号回显 javascript

javascript - 如何将 onclick 与表格行和谷歌地图一起使用

javascript - Google Maps API v3 的 {directionsService} API 存在问题

css - Highcharts.js - 将文本放在 donut 的中心

javascript - Highcharts + AngularJS 上的随机数

javascript - 如何在图例中的所有系列旁边添加图标

javascript - R Shiny : setExtremes in Highcharts (rCharts) on page load