echarts图表库 实现简单 雷达图
1.下载js文件
<script type=text/javascript src="js/echarts.js" charset=utf-8></script>
2.核心代码
<div id="sixStart" style="width:1323px; height:1300px;text-align: center;"></div>
<!-- 注意:div一定要设置宽 和 高,原因不明,不信你试试 -->
<script type="text/javascript">
var myChart = echarts.init(document.getElementById(sixStart));
var option = {
title : {
},
tooltip : {
trigger: axis
},
calculable : true,
polar : [
{
name: { show: true,textStyle:{fontSize:16,color:"#32cd32"}},
indicator : [
{text : 解决问题, max : 100},
{text : 学习能力, max : 100},
{text : 综合, max : 100},
{text : 技术能力, max : 100},
{text : 业务能力, max : 100},
{text : 思维模式, max : 100}
],center : [50%,50%],
radius : 500 //半径,可放大放小雷达图
}
],
series : [
{
name:,
type: radar,//图表类型 radar为雷达图
itemStyle: {
normal: {
lineStyle: {
color :"#87cefa",
width : 2
},
areaStyle: {
color:"#87cefa",
type: default
}
}
},
symbolSize :6,
data : [{
value:[100,80,80,80,80,80]
}]
}
]
};
$(function(){
myChart.setOption(option);
});
</script>
4.参考手册
