来源于官网例子.........官网自行百度（貌似不是官网忘了那个博客了楼主看见了给我说一下加一下链接（本人写完项目作业才总结的原谅我））
因为是在线引用不用导入任何包
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
</head>
<body>
<div id="main" style="width:100%;height: 500px;border: 1px solid black"></div>
</body>
<script type="text/javascript">
require.config({
paths: {
echarts: \'http://echarts.baidu.com/build/dist\'
}
});
// 使用
require(
[
\'echarts\',
//按需加载 (例如:使用柱状图就加载bar模块)
//\'echarts/chart/line\', //折线（面积）图
//\'echarts/chart/bar\', //柱状（条形）图
//\'echarts/chart/scatter\', //散点（气泡）图
//\'echarts/chart/k\', //K线图
//\'echarts/chart/pie\', //饼（圆环）图
//\'echarts/chart/radar\', //雷达（面积）图
//\'echarts/chart/chord\', //和弦图
//\'echarts/chart/force\', //力导向布局图
//\'echarts/chart/map\', //地图
//\'echarts/chart/gauge\', //仪表盘
//\'echarts/chart/funnel\', //漏斗图
//\'echarts/chart/eventRiver\', //事件河流图
//\'echarts/chart/venn\', //韦恩图
//\'echarts/chart/treemap\', //矩形树图
//\'echarts/chart/tree\', //树图
\'echarts/chart/wordCloud\', //字符云
//\'echarts/chart/mix\', //混搭
//\'echarts/chart/component\', //组件
//\'echarts/chart/other\', //其他
//\'echarts/chart/theme\', //主题
//\'echarts/chart/topic\', //专题
],
function (ec) {
// 基于准备好的dom，初始化echarts图表
var myChart = ec.init(document.getElementById(\'main\'));
function createRandomItemStyle() {
return {
normal: {
color: \'rgb(\' + [
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160)
].join(\',\') + \')\'
}
};
}
option = {
title: {
text: \'大数据云字符信息展示\',
link: \'http://www.google.com/trends/hottrends\'
},
tooltip: {
show: true
},
series: [{
name: \'Google Trends\',
type: \'wordCloud\',
size: [\'80%\', \'80%\'],
textRotation : [0, 45, 90, -45],
textPadding: 0,
autoSize: {
enable: true,
minSize: 14
},
data: [
{
name: "Sam S Club",
value: "10000",
itemStyle: createRandomItemStyle()
},
{
name: "Macys",
value: 6181,
itemStyle: createRandomItemStyle()
},
{
name: "Amy Schumer",
value: 4386,
itemStyle: createRandomItemStyle()//创建同的样式
},
{
name: "Jurassic World",
value: 4055,
itemStyle: createRandomItemStyle()
},
{
name: "Charter Communications",
value: 2467,
itemStyle: createRandomItemStyle()
}
]
}]
};
// 为echarts对象加载数据
myChart.setOption(option);
}
);
</script>
</html>