如何在 Highcharts 中添加 x 轴和 y 轴的网格线，但不显示 x 轴和 y 轴的值？

Question

https://jsfiddle.net/Kondaldurgam/7kLkh7ya/8/

我想只显示x和y轴的网格线，但是我没有x和y轴的数据，是否可能在没有数据的情况下显示？

$(function() {
Highcharts.chart('container', {

    chart: {
        type: 'bubble',
        plotBorderWidth: 1,
        zoomType: 'xyz'
    },
    legend: {
        enabled: false
    },
    credits: {
        enabled: false
    },

    title: {
        text: 'Using X Y Z Coordinates'
    },

    xAxis: {
        type: "category",
        gridLineWidth: 1
    },
    yAxis: {
        startOnTick: false,
        endOnTick: true,

        title: {
            text: ''
        },
    },
 });
});

- Kondal

---

你的意思是不想显示盒子？ - Darshak

你可以根据jQuery数据是否为空来判断是否显示和展示你的高级图表div。 - Darshak

我想要一个有网格线的框，但不需要X和Y轴的值。 - Kondal

你能否创建一个包含所有数据的 Fiddler? 我会尝试。 - Darshak

Answer 1

也许这会对你有所帮助.. 在其中使用这种逻辑.. fiddler

$(function () {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
          ignoreHiddenSeries : false
        },

        xAxis: {
        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
        }, {
            data: [129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4]        
        }]
    });

    // the button action
  var series = chart.series[0];    
  series.hide();
  series = chart.series[1];    
  series.hide();
});

- Darshak

---

我不想要值 - Kondal

Answer 2

如果您没有数据，您需要将 axis.showEmpty 设置为 true，并设置轴的最小值/最大值。您还需要至少有一个系列 - 它可能没有数据。

    Highcharts.chart('container', {

    chart: {
        type: 'bubble',
        plotBorderWidth: 1,
        zoomType: 'xyz'
    },
    legend: {
        enabled: false
    },
    credits: {
        enabled: false
    },

    title: {
        text: 'Using X Y Z Coordinates'
    },

    xAxis: {
        type: "category",
        gridLineWidth: 1,
        showEmpty: true,
        min: 0,
        max: 10
    },
    yAxis: {
        startOnTick: false,
        endOnTick: true,
                    showEmpty: true,
        title: {
            text: ''
        },
        min: 0,
        max: 10
    },


    series: [{}]

});

示例：https://jsfiddle.net/7kLkh7ya/9/

- morganfree

---

我不需要最小值和最大值，我只需要网格线。 - Kondal

您需要指定最小值和最大值。但是您也可以隐藏标签 https://jsfiddle.net/7kLkh7ya/10/ - morganfree