ucharts 柱状图圆角_调整柱状图圆角弧度

Echarts学习记录

var width;

var height;

var myChart;

$(function(){

//自适应设置

width = $(window).width();

height = $(window).height();

$("#mainBar").css("width",width-40);

$("#mainBar").css("height",height-40);

console.log(height);

setEcharts();

});

$(window).resize(function() {

width = $(window).width();

height = $(window).height();

$("#mainBar").css("width",width-40);

$("#mainBar").css("height",height-40);

});

function setEcharts(){

myChart = echarts.init(document.getElementById('mainBar'));

//自适应

window.onresize = myChart.resize;

myChart.setOption({

title : {

text: '未来一周气温变化',

subtext: '纯属虚构'

},

legend: {

data:['蒸发量','降水量']

},

calculable : true,

xAxis : [

{

//show:false, //影藏

type : 'category',

data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],

}

],

yAxis : [

{

type : 'value',

}

],

series : [

{

name:'蒸发量',

type:'bar',

data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]

},

{

name:'降水量',

type:'bar',

data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],

//顶部数字展示pzr

itemStyle: {

//柱形图圆角，鼠标移上去效果，如果只是一个数字则说明四个参数全部设置为那么多

emphasis: {

barBorderRadius: 30

},

normal: {

//柱形图圆角，初始化效果

barBorderRadius:[10, 10, 10, 10],

label: {

show: true,//是否展示

textStyle: {

fontWeight:'bolder',

fontSize : '12',

fontFamily : '微软雅黑',

}

}

}

},

}

]

});

}