Amcharts 카테고리 축 레이블이 겹침

Question

amCharts 자바 스크립트 차트 버전 3을 사용하고 있으며 최신 버전도 시도했습니다.

문제는 다음과 같습니다. 저는 scrollBar가있는 lineChart가 있습니다. 해당 차트의 categoryAxis에는 100 개가 넘는 레코드가 있으므로 처음에는 5-6으로 렌더링 한 다음 다른 categoryAxis 레이블을 확대/축소합니다. 여태까지는 그런대로 잘됐다.

그러나 확대/축소하면 categoryAxis의 라벨이 겹쳐서 확대/축소 후 그리드 수가 증가하여 실제로 엉망이 된 것처럼 보입니다.

나는 categoryAxis.autoGridCount을 시도했지만 아무런 운이 없었습니다.

미리 감사드립니다.

Answer 1

autoGridCount를 true로 설정해야합니다. 귀하의 설명에서 당신은 축 레이블에 꽤 많은 텍스트가 있다고 생각합니다. 나는 categoryAxis에 대해 minHorizontalGap을 100이나 그 이상 (기본값은 75)으로 늘릴 것을 권할 수 있습니다. 이게 도움이되지 않으면 내 차트를 볼 필요가있어.

Answer 2

저는 이것이 꽤 오래된 질문이지만, 최근에 만났던 문제이며 온라인에서 만족할만한 해결책을 찾지 못했습니다. 카테고리 라벨을 회전 할 때의 문제는 차트를 많이 축소 할 수 있다는 것입니다.

제가 생각해 낸 해결책은 레이블 포맷터를 사용하여 카테고리 라벨을 수직으로 비틀 거리는 것이 었습니다.

내 포맷터

https://amcharts.zendesk.com/entries/23473053-Formatting-axis-labels-using-custom-function하지만 기본적으로 당신이해야 할 모든 축에서의 labelFunction을 설정 여기 포매터를 설정하는 방법에 대한 몇 가지 정보가있다

var up = false; 

function formatLabel(value, valueString, axis){ 
    if(up) { 
     axis.labelOffset=0; 
    } 
    else { 
     axis.labelOffset=25; 
    } 
    up=!up; 

    return value; 
} 

"categoryAxis": { 
    "labelFunction":formatLabel 
} 

Answer 3

나는 내 범주 축에 동일한 문제가 있었는데 어느 것이 c 날짜를 ontains. 나는 그것을 해결이 내 솔루션입니다 : 가장 중요한 부분은 parseDate이가 acoarding, 자동으로 gridCount의 수를 설정하는 것이 중요하기 때문에 당신은 참으로 categoryAxis.autoGridCount을 설정해야합니다 거짓

categoryAxis.parseDates = false; 

로 설정되어 있다는 점이다 축의 크기

categoryAxis.autoGridCount = true; 

는

categoryAxis.minHorizontalGap = 100; 

언급 한 어떤 남자로 날짜 사이의 공간을 만듭니다.

내 사용법은 다음과 같습니다

//Category Axes 
    var categoryAxis = chart2.categoryAxis; 
    categoryAxis.gridAlpha = 0; 
    categoryAxis.autoGridCount = true; 
    categoryAxis.minHorizontalGap = 100; 
    categoryAxis.gridPosition = "start"; 
    categoryAxis.equalSpacing = false; 
    categoryAxis.parseDates = false; 
    categoryAxis.minPeriod = "DD"; 
    categoryAxis.startOnAxis = true; 
    categoryAxis.axisColor = "#dcdcdc"; 
    categoryAxis.axisThickness = 1; 
    categoryAxis.showLastLabel = true;