하이 차트 스태킹 막대 차트 테두리가 오른쪽에 표시되지 않음

스태킹 막대 차트를 만들 때 맨 오른쪽 '상자'에는 테두리가 오른쪽에 그려지지 않습니다.하이 차트 스태킹 막대 차트 테두리가 오른쪽에 표시되지 않음

Highcharts에 설정할 수있는 옵션이 있습니까? 아래 보이는 이미지에서 흰색 경계선을 75 % 상자 주위로 끌어 오게하려면 어떻게해야합니까? http://jsfiddle.net/zKgsF/

Image of the problem

참고 : 다음은

내가 테스트에 사용 된 jsfiddle에 대한 링크입니다 표시에 1 개보다 작품에 borderWidth 속성을 설정하지만, 가장 오른쪽 테두리보다 훨씬 얇다 다른 사람. 아래 이미지를 참조하십시오. 여기

borderWidth to 5

차트에 대한 자바 스크립트입니다 :

$(function() { 
    var chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'bar', 
      backgroundColor: 'rgba(0,0,0,.3)', 
      margin: [15,6,15,15], 
     }, 
     xAxis: { 
      categories: [''] 
     }, 
     credits: { 
      enabled: false 
     }, 
     yAxis: { 
      gridLineColor: "#FF0000", 
      labels: 
      { 
      align: 'right', 
      formatter: function() 
      { 
       return this.value + "%"; 
      } 
       }, 
     }, 
     tooltip: { 
       formatter: function() 
      { 
         return "<b>" + this.series.name + '</b>: ' + this.y + ' (' +   Math.round(this.percentage,1) + "%)"; 
       } 
      }, 
     plotOptions: { 
       bar: { 
        animation: false, 
        stacking: 'percent', 
        borderWidth: '1', 
        dataLabels: { 
         enabled: true, 
         color: 'white', 
         formatter: function() { 

          if (this.percentage < 10) 
          { 
           return "" 
          } 
          else 
          { 
           return Math.round(this.percentage,1) + "%"; 
          } 
         }, 
         style: { 
          fontSize: '18px' 
         } 

        } 
       } 
     }, 
     series: [{ 
      data: [30]   
     },{ 
      data: [10]   
     }] 
    }); 
});

편집 :이 막대 차트는 "스택"인 관련이없는 것처럼

보인다. 차트가 최대 'y'값 축으로 이동한다는 사실과 관련이 있습니다 ... http://jsfiddle.net/zKgsF/1/

출처

2013-01-09 Robodude

어떻게해야할지 모르지만 도움이된다면 트릭을 사용할 수 있습니다. yAxis의 최대 값을 101로 설정하고 labels.formatter 옵션에서 100보다 큰 yValues를 인쇄하지 않는 조건을 지정하십시오. jsfiddle 살펴보기 : http://jsfiddle.net/zKgsF/23/ – cubbuk

Cubbuk에서 제안한대로 max 값을 추가하여 조정할 수 있습니다 yAxis.

또한 endOnTick 속성을 지정할 수 있습니다.

max: 100.1, 
endOnTick: false

API를 들어 here을 탐색하고 여기에 대한 example입니다.

출처

2013-01-09 12:58:41

하이 차트 스태킹 막대 차트 테두리가 오른쪽에 표시되지 않음

답변

관련 문제