Development Tip

축 및 격자 선 숨기기

yourdevel 2020. 10. 17. 12:31
반응형

축 및 격자 선 숨기기


내 Highcharts 차트의 축과 격자 선을 완전히 숨기려고합니다. 지금까지 선의 너비를 0으로 설정하려고했지만 작동하지 않았습니다.

xAxis: {
  lineWidth: 0,
  minorGridLineWidth: 0,
  lineColor: 'transparent'
}

"일반"플롯을 생성하기 위해 축 선 / 틱 및 격자 선을 전역 적으로 비활성화 할 수 있습니까?


그냥 추가

xAxis: {
   ...  
   lineWidth: 0,
   minorGridLineWidth: 0,
   lineColor: 'transparent',
   ...          
   labels: {
       enabled: false
   },
   minorTickLength: 0,
   tickLength: 0
}

xAxis 정의에.


를 들어 yAxis당신은 또한이 필요합니다 :

gridLineColor: 'transparent',


v4.9의 Highcharts보다 큰 버전이 visible: false있는 경우 xAxisyAxis설정 에서 사용할 수 있습니다 .

예:

$('#container').highcharts({

    chart: {
        type: 'column'
    },

    title: {
        text: 'Highcharts axis visibility'
    },

    xAxis: {
        visible: false
    },

    yAxis: {
        title: {
            text: 'Fruit'
        },
        visible: false
    }

});

yAxis의 격자 선을 다음과 같이 숨길 수도 있습니다.

yAxis:{ 
  gridLineWidth: 0,
  minorGridLineWidth: 0
}

나는 단지 내 것을 끌 수 있었다

       lineColor: 'transparent',
       tickLength: 0

config 객체를 건드리지 않으려면 CSS로 그리드를 숨 깁니다.

.chart-container .highcharts-grid {
   display: none;
}

이것은 항상 나를 위해 잘 작동했습니다.

yAxes: [{
         ticks: {
                 display: false;
                },

참고 URL : https://stackoverflow.com/questions/10877927/hide-axis-and-gridlines-highcharts

반응형