rose 차트를 사용하여 ECharts에서 데이터 비율을 표시하는 방법
요약: Rose 차트는 데이터 비율을 표시하는 데 사용할 수 있는 시각적 데이터 분석 도구입니다. 이 기사에서는 ECharts 라이브러리를 사용하여 웹 페이지에 장미 차트를 그리는 방법을 소개하고 구체적인 코드 예제를 제공합니다.
소개: 장미 차트는 데이터 분석 및 시각화에서 일반적으로 사용되는 차트 유형으로 원의 중심이 원점이 되고 데이터의 비율이 다양한 섹터 각도로 표시되는 것이 특징입니다. 로즈 차트를 통해 다양한 데이터 범주의 비율을 시각적으로 비교할 수 있습니다. ECharts는 장미 차트를 포함한 다양한 차트 유형을 지원하는 강력한 데이터 시각화 라이브러리입니다.
이 글은 다음 부분으로 나누어집니다:
<script src="https://cdn.jsdelivr.net/npm/echarts@4.9.0/dist/echarts.min.js"></script>
var data = [ {name: '地区1', value: 50}, {name: '地区2', value: 30}, {name: '地区3', value: 80}, {name: '地区4', value: 60}, {name: '地区5', value: 40} ];
그 중 name은 지역명을 나타내고, value는 해당 지역의 판매량을 나타냅니다.
<div id="chart" style="width: 800px; height: 600px;"></div>
var option = { title: { text: '产品销售占比', left: 'center' }, legend: { orient: 'vertical', left: 'left', data: ['地区1', '地区2', '地区3', '地区4', '地区5'] }, color: ['#2378e1', '#60a1bc', '#87d9ef', '#de742f', '#7dbb94'] };
그 중 title은 차트의 제목을 나타내고, legend는 범례를 나타내며, data는 범례의 이름을 나타내고, color는 섹터의 색상을 나타냅니다.
var chart = echarts.init(document.getElementById('chart')); chart.setOption(option);
위 단계를 통해 웹페이지에 장미 그림을 그릴 수 있습니다.
요약: 이 글에서는 ECharts 라이브러리를 사용하여 웹 페이지에 장미 차트를 그리는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 로즈 차트를 통해 데이터의 비율을 시각적으로 표시하고 데이터 분석 및 의사결정에 도움을 줄 수 있습니다. 이 기사가 독자들이 로즈 차트를 이해하고 사용하는 데 도움이 되기를 바랍니다.
위 내용은 장미 차트를 사용하여 ECharts에 데이터 비율을 표시하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!