홈>
열 차트에 각 계열에 대한 줄거리가 있습니다. 현재 시리즈는 차트가 표시 될 때만 표시되지만 범례 항목을 클릭하면 해당 항목과 해당 줄거리가 표시되지만 다른 모든 시리즈/줄거리는 숨기는 기능을 추가하고 싶습니다. 현재 코드가있는 바이올린은 다음과 같습니다. https://jsfiddle.net/nhrmc/5d46bL2f/
바이올린은 여기에서 찾을 수 있습니다 : https://jsfiddle.net/nhrmc/5d46bL2f/
var chart = Highcharts.chart('container', {
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
},
yAxis: {
plotLines: [{
value: 50,
color: 'red',
width: 2,
id: 'plot-line-1'
}]
},
series: [{
events: {
show: function() {
chart.yAxis[0].addPlotLine({
value: 7,
color: 'red',
width: 2,
id: 'plot-line-1'
});
},
hide: function() {
chart.yAxis[0].removePlotLine('plot-line-1')
}
},
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],
type: 'column',
}, {
events: {
show: function() {
chart.yAxis[0].addPlotLine({
value: 75,
color: 'blue',
width: 2,
id: 'plot-line-2'
});
},
hide: function() {
chart.yAxis[0].removePlotLine('plot-line-2')
}
},
data: [20, 70, 100, 125, 140, 176.0, 132, 145, 21.4, 191, 96, 54],
type: 'column',
visible: false
}
]
});
범례에서 "Series 2"를 클릭하고 관련 줄거리와 함께 표시하고 Series 1 및 관련 줄거리를 숨길 것으로 예상됩니다. 따라서 하나의 시리즈/플롯 라인 조합 만 표시되어야합니다.
- 답변 # 1
관련 자료
- javascript - Highcharts에서 동일한 시리즈로 두 개의 X 축을 어떻게 만들 수 있습니까?
- javascript - highcharts - json 데이터를 사용하여 월별 및 연도별로 그룹화 한 여러 시리즈 만들기
- javascript - 다중 차트 내보내기가 하이 차트에서 잘못 정렬되었습니다
- javascript - 높은 차트에서 하나의 특정 시리즈를 강조 표시하는 방법이 있습니까?
- php - Highcharts에서 그룹 데이터를 특정 계열로 채 웁니다
- Highcharts - 하이 차트 - 각도에서 시리즈를 업데이트하는 방법?
- Highcharts 드릴 다운 범례에서 시리즈 제목 변경
- Highcharts PlotBand 및/또는 PlotLines를 xAxis/top tick보다 낮거나 높게 그릴 수 있습니까?
- 각도 높은 차트에서 계열 데이터에 클래스 이름 추가
- Highcharts - 하이 차트 - 시리즈의 하위 집합에 대해서만 stacklabels를 사용할 수 있습니까?
- 하이 차트에는 시리즈 창에 오버레이 된 제목 텍스트가 표시됩니다
- javascript - 하이 차트 - json 데이터를 사용하여 여러 계열 만들기
- javascript - HighCharts는 범례에서 일부 시리즈 이름을 비활성화합니다
- Highcharts x-range 시리즈의 포인트 연결
- angularjs - Highcharts PIE 차트 시리즈 색상이 변경되지 않습니다
- javascript - 하이 차트 상자 그림에서 숨겨진 시리즈의 xAxis 범주를 숨기는 방법은 무엇입니까?
- javascript - Highcharts 시리즈 크기에 제한이 있습니까?
- highcharts - 시리즈 업데이트 애니메이션 제공 포인트 업데이트 애니메이션과 동일한 부드러움
- Highcharts에서 plotLines 내에서 CSS 속성을 호출하는 방법
- ruby on rails - 시리즈의 날짜/시간 형식 - 하이 차트
트렌드
- OpenCv의 폴더에서 여러 이미지 읽기 (python)
- 파이썬 셀레늄 모든 "href"속성 가져 오기
- html - 자바 스크립트 - 클릭 후 변경 버튼 텍스트 변경
- javascript - 현재 URL에서 특정 div 만 새로 고침/새로 고침
- JSP에 대한 클래스를 컴파일 할 수 없습니다
- JavaScript 변수를 HTML div에 '출력'하는 방법
- git commit - 자식 - 로컬 커밋 된 파일에 대한 변경을 취소하는 방법
- jquery - JavaScript로 현재 세션 값을 얻으시겠습니까?
- javascript - swiperjs에서 정지, 재생 버튼 추가
- python - 화면에서 찾은 요소를 찾을 수없는 경우 셀레늄
legendItemClick
에서 콜백 함수를 사용하면 다른 모든 시리즈와 줄거리를 숨길 수 있습니다.실시간 데모 :https://jsfiddle.net/BlackLabel/os86px7v/
API 참조 :https://api.highcharts.com/highcharts/plotOptions.series.events.legendItemClick