【www.bbyears.com--php常用代码】
效果图如下
实例代码
<script src="</script">http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="echarts-all.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var option = { //可以去官网上根据每个案例不同的option去写各种图形
title: { //标题
text: "OP系统点击量"
},
tooltip: { //提示框,鼠标悬浮交互时的信息提示
show:true,
trigger: "axis"
},
legend: { //图例,每个图表最多仅有一个图例
x: "center",
data: ["ESOP系统", "VGOP系统"]
},
polar: [{ //极坐标
indicator: [{text: "计划部",max: 100},
{text: "市场部",max: 100},
{text: "政企客户部",max: 100},
{text: "客户服务部",max: 100},
{text: "铁通公司",max: 100},
{text: "其他",max: 100}
],
radius: 100,
startAngle: 120 // 改变雷达图的旋转度数
}],
series: [{ // 驱动图表生成的数据内容数组,数组中每一项为一个系列的选项及数据
name: "总点击量",
type: "radar",
itemStyle: {//图形样式,可设置图表内图形的默认样式和强调样式(悬浮时样式):
normal: {
areaStyle: {
type: "default"
}
}
},
data: [{
value: [], //外部加载,也可以通过ajax去加载外部数据。
name: ""
}, {
value: [78,98,90,94,98,37],
name: "VGOP系统"
}]
}]
};
$(function() {
option.series[0].data[0].value=[12,32,34,53,53,65]; // 加载数据到data中
option.series[0].data[0].name ="ESOP系统";
var myChart = echarts.init(document.getElementById("main"));
myChart.setOption(option, true); //为echarts对象加载数据
});
</script>