在业务需求中，有时候会遇到ECharts散点图，现在记录一下，今天解决了一个小问题，ECharts散点图大小调整。
话不多说，首先上图：
$(document).ready(function() {
var MyScatter = echarts.init(document.getElementById('Scatter'));
var data = [
['2012-03-01',
1,
"翻身"
],
[
'2013-06-01',
2,
"没翻身"
],
[
'2014-03-02',
3,
"翻身"
],
[
'2015-03-03',
5,
"翻身"
],[
'2016-03-04',
7,
"翻身"
]
];
var textStyle = {
color: '#333',
fontStyle: 'normal',
fontWeight: 'normal',
fontFamily: '微软雅黑',
fontSize: 14,
};
option = {
tooltip: {
/*返回需要的信息*/
formatter: function(param) {
var value = param.value;
return '
'
}
},
xAxis: {
type: 'time',
name: '时间轴',
},
yAxis: {
type: 'value',
name: '次数值',
max: 13,
min: 0,
},
series: [{
name: '',
data: data,
type: 'scatter',
symbolSize: 60
}]
};
MyScatter.setOption(option);
});
但是写完之后，发现不足的地方有，每个点都太大了，所以要修饰一下，把散点的大小改变一下：
在上面的代码里面找到：修改 symbolSize: 60里面的值就行了
series: [{
name: '',
data: data,
type: 'scatter',
symbolSize: 60
}]
这里我把值修改成了 symbolSize: 40，效果好看了 许多，更多的属性，比如说颜色，大小，间距等都是可以作调整的，可以研究一下ECharts官方文档。
原文作者：祈澈姑娘 技术博客：https://www.jianshu.com/u/05f416aefbe1
90后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚。
坚持总结工作中遇到的技术问题，坚持记录工作中所所思所见，对于博客上面有不会的问题，可以加入qq技术交流群聊：702834751。