echarts标题属性设置

最新推荐文章于 2024-04-18 19:10:21 发布

weixin_30342209

最新推荐文章于 2024-04-18 19:10:21 发布

阅读量233

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/ciscolee/p/7507955.html

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>echarts学习</title>
<script src="F:\毕业设计课题和资料\echarts可视化工具\echarts.js"></script>
</head>
<body>
<div id="main" style="width: 800px;height: 500px;"></div>
<script type="text/javascript">
//初始化echarts
var myecharts = echarts.init(document.getElementById('main'));
//画柱状图

var option ={
title:{
text:'echarts入门',
link:'http://www.baidu.com',//主标题超链接
target:'blank',//主标题超链接打开方式
textStyle:{ //设置主标题风格
Color:'green',//设置主标题字体颜色
fontStyle:'',//主标题文字风格

},
subtext:'副标题',
sublink:'http://www.baidu.com',//副标题超链接
subtarget:'blank',//副标题超链接打开方式
padding:[5,10,5,5],//设置标题内边距,上，右，下，左
itemGap:10,//主副标题之间的间距

/*left:'left',//组件的位置,center,left,right
top:'top',//组件离上边的距离middle,top,bottom*/ //此二者的优先级高于x吗?答案：是
x:'center',
backgroundColor:'white',//标题背景色
borderColor:'gray',//标题边框颜色
borderWidth:5,//标签线框
borderRadius:5,//边框切圆角
shadowBlur:10,//图形阴影模糊大小,该属性配合 shadowColor,shadowOffsetX(阴影水平方向上的偏移距离), shadowOffsetY(阴影垂直方向上的偏移距离。) 一起设置图形的阴影效果。
shadowColor:'rgba(0,0,0,0.5)'//阴影颜色
},
tooltip:{},
legend:{
data:'销量'
},
xAxis:{
data:["裤子","羊毛衫","拖鞋"]
},
yAxis:{},
series:[{
name:'销量',
type:'bar',
data:[10,29,30]
}]
};

myecharts.setOption(option);
</script>
</body>
</html>

转载于:https://www.cnblogs.com/ciscolee/p/7507955.html

weixin_30342209

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
echarts标题属性设置

<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title>echarts学习</title> <script src="F:\毕业设计课题和资料\echarts可视化工具\echarts.js"></script></head&...
复制链接

扫一扫