删除高图上的Y轴网格线 [英] Remove Y-Axis GridLines on Highcharts

问题描述

是否可以删除除最外面的线以外的所有y轴网格线?

Is it possible to remove all the y-axis grid lines except the outermost line?

在此jsfiddle中( http://jsfiddle.net/abyrne85/g7vpq8ce/1/)，例如，我正在尝试删除所有线(x轴和y轴)，仅保留最外面的线和数据线.

In this jsfiddle (http://jsfiddle.net/abyrne85/g7vpq8ce/1/) for example, I'm trying to remove all lines (x-axis and y-axis) leaving just the outermost line and the data line, of course.

   $(function () {

    $('#container').highcharts({

        chart: {
            polar: true,
            type: 'line'
        },

        title: {
            text: null,
            x: -80
        },

        xAxis: {
            categories: ['Sales', 'Marketing', 'Development',                 'Customer Support','Information Technology'],
            tickmarkPlacement: 'on',
            lineWidth: 0
        },

        yAxis: {
            gridLineInterpolation: 'polygon',
            lineWidth: 0,
            min: 0
        },

        legend: {
            enabled:false
        },

        series: [{      
            data: [5, 3, 4, 3, 2],
            pointPlacement: 'on'
        }]
    });
});

推荐答案

1..将xAxis的 gridLineWidth 设置为0以将其删除.

1. Set gridLineWidthof xAxis to 0 to remove them.

2..将yAxis的 tickInterval 设置为大于数据数组中的最大值，这样它将是唯一的网格线.

2. Set tickInterval of yAxis larger than the maximum value in the data array so it will be the only grid line.

$(function () {
    var myData = [5, 3, 4, 3, 2],
        tickIntr = Math.max.apply(null, myData) + 1; //this is to set 
        //the tickInterval larger than the maximum value in data array

    $('#container').highcharts({
        chart: {
            polar: true,
            type: 'line',
        },

        title: {
            text: null,
            x: -80
        },

        xAxis: {
            categories: ['Sales', 'Marketing', 'Development', 
                         'Customer Support','Information Technology'],
            tickmarkPlacement: 'on',
            lineWidth: 0,
            gridLineWidth: 0 //Remove xAxis lines
        },

        yAxis: {
            gridLineInterpolation: 'polygon',
            lineWidth: 0,
            min: 0,
            tickInterval: tickIntr //set yAxis tickInterval
        },

        legend: {
            enabled:false
        },

        series: [{      
            data: myData,
            pointPlacement: 'on'
        }]
    });
});

http://jsfiddle.net/g7vpq8ce/2/

这篇关于删除高图上的Y轴网格线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！