提交 7d040942 编写于 作者: T tinyu

fix:调整配置

上级 23b43487
import * as echarts from 'echarts';
import moment from 'moment';
export default function(){
const baseOption ={
const GraphType = Object.freeze({
Rect: 1,
Img: 2,
})
/**
* 获取自定义渲染函数
* 内部设定高度映射 y[1-3] 2:表示竖向中间位置
*/
function getRenderItem(yTick) {
return function (params, api) {
const data = {
start: api.value(0),
end: api.value(1)
}
const status = api.value(2)
const [start, pos_y] = api.coord([data.start, yTick])
const [end] = api.coord([data.end, yTick])
const height = api.size([0, 1])[1] * 0.15
const rect = echarts.graphic.clipRectByRect(
{
x: start,
y: pos_y - height / 2,
width: end - start,
height: height
},
{
x: params.coordSys.x,
y: params.coordSys.y,
width: params.coordSys.width,
height: params.coordSys.height
}
)
const childrenImageLine = [
{
type: 'rect',
shape: rect,
style: api.style(),
emphasis: {
style: api.styleEmphasis()
}
}
]
return {
type: 'group',
children: childrenImageLine
}
}
}
export default function () {
const baseOption = {
backgroundColor: 'transparent',
color: ['#fc7778', '#7481fd', '#02d18f', '#2cd0ff', '#edcf02', '#fe8a3d'],
grid: {
......@@ -112,8 +166,7 @@ export default function(){
fontSize: 12
},
formatter: val => {
return `${
typeof val.value[2] === 'string' ? val.value[2] : val.seriesName
return `${typeof val.value[2] === 'string' ? val.value[2] : val.seriesName
} ${moment(val.value[0]).format('MM-DD HH:mm')} ~ ${moment(
val.value[1]
).format('MM-DD HH:mm')}`
......@@ -144,52 +197,66 @@ export default function(){
shadowBlur: 5
}
},
renderItem: (params, api) => {
const data = {
start: api.value(0),
end: api.value(1)
}
const status = api.value(2)
const [start, pos_y] = api.coord([data.start, 2])
const [end] = api.coord([data.end, 2])
const height = api.size([0, 1])[1] * 0.15
const rect = echarts.graphic.clipRectByRect(
renderItem: getRenderItem(2),
data: [
{
x: start,
y: pos_y - height / 2,
width: end - start,
height: height
value: ['2020-03-01 12:00:00', '2020-03-03 00:00:00']
},
['2020-03-03 01:00:00', '2020-03-14 00:00:00'],
['2020-03-14 08:03:00', '2020-03-14 08:13:00'],
['2020-03-15 02:00:00', '2020-04-01 00:00:00']
]
},
{
x: params.coordSys.x,
y: params.coordSys.y,
width: params.coordSys.width,
height: params.coordSys.height
}
)
const childrenImageLine = [
{
type: 'rect',
shape: rect,
style: api.style(),
name: '测试2',
type: 'custom',
colorBy: 'data',
encode: {
x: [0, 1],
y: 1
},
itemStyle: {
emphasis: {
style: api.styleEmphasis()
}
borderColor: 'rgba(192, 249, 254, 0.85)',
borderType: 'solid',
borderWidth: 1,
shadowColor: 'rgba(192, 249, 254, 0.85)',
shadowOffsetY: 1,
shadowOffsetX: -1,
shadowBlur: 5
}
},
renderItem: getRenderItem(1.75),
data: [
{
value: ['2020-02-29 12:00:00', '2020-03-02 00:00:00']
},
]
return {
type: 'group',
children: childrenImageLine
},
{
name: '测试3',
type: 'custom',
colorBy: 'data',
encode: {
x: [0, 1],
y: 1
},
itemStyle: {
emphasis: {
borderColor: 'rgba(192, 249, 254, 0.85)',
borderType: 'solid',
borderWidth: 1,
shadowColor: 'rgba(192, 249, 254, 0.85)',
shadowOffsetY: 1,
shadowOffsetX: -1,
shadowBlur: 5
}
},
renderItem: getRenderItem(2.25),
data: [
{
value: ['2020-03-01 12:00:00', '2020-03-03 00:00:00']
value: ['2020-03-02 08:00:00', '2020-03-03 20:00:00']
},
['2020-03-03 01:00:00', '2020-03-14 00:00:00'],
['2020-03-14 08:03:00', '2020-03-14 08:13:00'],
['2020-03-15 02:00:00', '2020-04-01 00:00:00']
]
},
]
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册