温度计是由水球图通过配置项变换而来,是常规图表的一种,支持自定义SVG图形展示,能够通过自定义系列的文本或者图片达到多种效果,适用于展示单一数据的完成情况。本文档为您介绍基础款水球图各配置项的含义,帮助您快速准确地使用水球图组件。
基础设置
width:组件在编辑器中的宽度
height:组件在编辑器中的高度
top:组件与编辑器顶部的距离
left:组件与编辑器左侧的距离
全局
形状:水球图的展示图形,支持自定义SVG代码定制化展示
自定义path:如果选择了“自定义svg”形状,可在此处输入自定义svg的path路径
图形大小:图形在划定区域内的大小
轮廓
显示/隐藏:是否展示水球图的轮廓
内部间距:展示的轮廓与水球图的间距
轮廓样式
宽度:轮廓的宽度
颜色:轮廓的颜色,支持hex、rgb以及rgba格式的色值
阴影颜色:轮廓的阴影颜色,支持hex、rgb以及rgba格式的色值
阴影范围:轮廓的阴影范围
透明度:轮廓的透明度
波浪
振幅:波浪的振动幅度,值越大,波浪越大
荡漾方向:选择波浪荡漾的方向,可选从左到右、从右到左
波浪颜色:配合数据项wave字段,控制波浪的颜色
return {
wave: [0.5]
}
样式
阴影颜色:波浪阴影的颜色
阴影范围:波浪阴影的范围
透明度:波浪的透明度
动画
开启:是否开启波浪的滚动动画
动画时长:控制波浪滚动的快慢,时间越短,波浪滚动频率越快
背景
背景颜色:是否展示该表图的图例
边框宽度:图形的边框宽度
边框颜色:图形的边框颜色
自定义元素
该配置项为一个数组,可配置多个自定义元素,自定义的元素可以是普通文本也可以是图片
类型:选择自定义元素的类型,可选:文本、图片
位置
控制类型:位置的控制类型,可选:系统控制、手动控制
系统控制
横向位置:可选居左、居中、居右
纵向位置:可选上侧、居中、下侧
手动控制
左边距:自定义元素的左边距
上边距:自定义元素的上边距
文本
文本内容:文本所要展示的内容
字号:文本的字体大小
颜色:文本的颜色,支持hex、rgb以及rgba格式的色值
字体:文本的字体
字体粗细:文本字体的粗细
图片
上传图片:上传本地的图片
图片宽度:设置图片的宽度
图片高度:设置图片的高度
return [{
graphic:[{
text:"xxx"
},{
image:"https://xxx.png"
}],
wave:[0.5]
}]
如果在配置项和数据项均对自定义元素进行了配置,系统会优先选择数据项的配置
graphic:自定元素集合
text:自定义的文本内容
image:自定义图片的在线链接地址