export const topheaderCommon = () => ({

fromDate: "2024-04-09T20:49",
toDate: "2024-04-09T20:49",
selected: "FromTODate",
type: "none",
isSingleSelect: false,
selectITems:
{
title: "text",
isTitle: true,
data: [{
id: generateDynamicId(),
name: "Item 1"
}]
},
trendName: "trand",
title: "Trend",
props: {
height: "",
width: "",

padding: "0px 4px 0px 4px",

fontFamily: "",
fontSize: "",
fontWeight: "",
textAlign: "",
color: "",
backgroundColor: "",
borderWidth: "1px 1px 1px 1px",
borderColor: "#d9d9d9",
borderStyle: "",
borderRadius: "2px 2px 2px 2px",
boxShadow: "none",
backgroundImage: "none",
},
});

export const chartHeaderPropsCommonProps = ({ chartName }) => ({

height: "",
width: "",
titleColor: "",
isTitlePresent: true,
title: chartName,
margin: "1px 5px 1px 1px",
padding: "0px 0px 0px 0px",
fontFamily: "",
fontSize: "",
fontWeight: "",
textAlign: "",
color: "",
backgroundColor: "",
borderWidth: "",
borderColor: "",
borderStyle: "",
borderRadius: "",
boxShadow: "none",
backgroundImage: "none",
});
export const textStyleProperties=()=>({
color:"",
fontStyle:"normal",// normal oritalic or oblique
fontWeight:300,
fontFamily:"sans-serif",
fontSize:15,
lineHeight:1,
width:2,
height:2,
textBorderColor:"",
textBorderWidth:0,
textBorderType :"solid", //solid or dashed or dotted
textShadowColor:"",
textShadowBlur:0,
textShadowOffsetX:0,
textShadowOffsetY:0,
overflow:"none",//truncate or break or breakAll or none
})

export const styleProperties=()=>({

color:"",
fontStyle:"normal",// normal oritalic or oblique
fontWeight:300,
fontFamily:"sans-serif",
fontSize:15,
align:"center",// left or center or right
verticalAlign:"middle",// top or middle or bottom
lineHeight:1,
backgroundColor:'transparent",
borderColor:"",
borderWidth:0,
borderType:"solid", //solid or dashed or dotted
borderRadius:0,
padding:[0,0,0,0],// array or number
shadowColor:"",
shadowBlur:0,
shadowOffsetX:0,
shadowOffsetY:0,
width:2,
height:2,
textBorderColor:"",
textBorderWidth:0,
textBorderType :"solid", //solid or dashed or dotted
textShadowColor:"",
textShadowBlur:0,
textShadowOffsetX:0,
textShadowOffsetY:0,
overflow:"none",//truncate or break or breakAll or none
})

export const lineStyleProperties=()=>({

color:"",
width:0,
type:"solid", //solid or dashed or dotted
shadowBlur:0,
shadowColor:"",
shadowOffsetX:0,
shadowOffsetY:0,
opacity:0,
 })

export const shadowStyleProperties=()=>({

color:"",
shadowBlur:0,
shadowColor:"",
shadowOffsetX:0,
shadowOffsetY:0,
opacity:0,
})

export const iconStyleProperties=()=>({

color:"",
borderColor:"",
borderWidth:0,
borderType:"solid", //solid or dashed or dotted
borderRadius:0,
shadowBlur:0,
shadowColor:"",
shadowOffsetX:0,
shadowOffsetY:0,
opacity:0,
})

export const endLabel=()=>({

show:true,
distance:0,
rotate:0,
offset:[0,0], // [ horizontally , vertically]
minMargin:0,
...styleProperties(),
})

export const labelLine=()=>({

show:true,
lineStyle:lineStyleProperties(),
})

export const labelLayout=()=>({ //(x, y) position

hideOverlap:true,
moveOverlap:"shiftX", // shiftX or shiftY
x:0, // number or String
y:0, // number or String
rotate:0,
width:0,
height:0,
align:"center",// left or center or right
verticalAlign:"middle",// top or middle or bottom
fontSize:15,
draggable:false,
})

export const emphasisStyles =() =>({

disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
label:{
show:true,
distance:0,
 rotate:0,
offset:[0,0], // [ horizontally , vertically]
minMargin:0,
...styleProperties(),
},
labelLine:labelLine(),
itemStyle:iconStyleProperties(),
})

export const blurStyles =() =>({

label:{
show:true,
distance:0,
rotate:0,
offset:[0,0], // [ horizontally , vertically]
minMargin:0,
...styleProperties(),
},
labelLine:labelLine(),
itemStyle:iconStyleProperties(),
})

export const selectStyles =() =>({

disabled:false,
label:{
show:true,
distance:0,
rotate:0,
offset:[0,0], // [ horizontally , vertically]
minMargin:0,
...styleProperties(),
},
labelLine:labelLine(),
itemStyle:iconStyleProperties(),
})

export const labelStyles =() =>({

show:true,
distance:0,
rotate:0,
offset:[0,0], // [ horizontally , vertically]
minMargin:0,
...styleProperties(),
})

export const chartSubTitle = ({ chartName }) => ({

id: generateDynamicId(),
show : false,
text: chartName,
link:"",
target:"blank", // blank or self
textStyle:styleProperties(),
subtext:"",
sublink:"",
subtarget:"blank", // blank or self
subtextStyle:styleProperties(),
textAlign:"center",// auto or left or center or right
textVerticalAlign:"center",// auto or left or center or right
padding:[0,0,0,0],// array or number
 itemGap:0,
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
backgroundColor:'transparent",
borderColor:"",
borderWidth:0,
borderType:"solid", //solid or dashed or dotted
borderRadius:0,
shadowColor:"",
shadowBlur:0,
shadowOffsetX:0,
shadowOffsetY:0,
});

export const axisdetailsWithoutMinimum = () => ({

show:true,
gridIndex:1,
alignTicks:true,
position:bottom, // top or bottom for x Axis and left or right
offset:0,
type:"value" , //value or category or time or log
name:"Name Of Axis",
nameLocation:"center", // start or middle or center or end
nameTextStyle:styleProperties(),
nameGap:0,
nameRotate:0,
inverse:true,
min:0, //number or string or function
max:100, //number or string or function
scale:false,
splitNumber:0,
minInterval:0,
maxInterval:0,
interval:0,
logBase :10,
startValue:0,
axisLine:{
show:true,
onZero:true,
lineStyle:lineStyleProperties(),
},
axisTick:{
show:true,
alignWithLabel:true,
inside:false,
length:1,
lineStylelineStyleProperties(),
},
minorTick:{
show:true,
splitNumber:0,
length:1,
lineStyle:lineStyleProperties(),
},
axisLabel:{
 show:true,
inside:true,
rotate:0
margin:0,
interval:1, //number or function or auto
formatter:"", // String or Function {yyyy},{yy},{Q},{MMMM},{MMM},{MM},{M},
{dd},{d},{eeee},{ee},{e},{HH},{H},{hh},{h},{mm},{m},{ss},{s},{SSS},{S},{A},{a}.
showMinLabel:false,
showMaxLabel:false,
alignMinLabel:"left", //left or center or right or null
alignMaxLabel:"left", //left or center or right or null
hideOverlap:true,
...styleProperties(),
},
splitLine:{
show:true,
showMinLine:true,
showMaxLabel :false,
lineStyle:lineStyleProperties(),
},
minorSplitLine:{
show:true,
lineStyle:lineStyleProperties(),
},
splitArea:{
show:true,
areaStyle:shadowStyleProperties(),
},
data: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday',
'Sunday'], // Array or
data: [{
value: 'Monday',
textStyle: styleProperties(),
}, 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
axisPointer:{
show:true,
type:"line", // line or shadow or none
snap:false,
z:0,
triggerEmphasis:false,
triggerTooltip:false,
value:0,
status:true,
label:{
show :true,
precision:"auto" , // number or auto
margin:0,
...styleProperties(),
},
lineStyle:lineStyleProperties(),
shadowStyle:shadowStyleProperties(),
},
tooltip:{
show:true,
backgroundColor:"",
borderColor:"",
borderWidth:0,
padding:0,
textStyle:styleProperties(),
 },
animation:true,
animationThreshold:0,
animationDuration:0,
animationDurationUpdate:0,
zlevel:0,
z:0,
});

export const axisdetails = ({ name, min }) => ({

show:true,
gridIndex:1,
alignTicks:true,
position:bottom, // top or bottom for x Axis and left or right
offset:0,
type:"value" , //value or category or time or log
name,
nameLocation:"center", // start or middle or center or end
nameTextStyle:styleProperties(),
nameGap:0,
nameRotate:0,
inverse:true,
min, //number or string or function
max:100, //number or string or function
scale:false,
splitNumber:0,
minInterval:0,
maxInterval:0,
interval:0,
logBase :10,
startValue:0,
axisLine:{
show:true,
onZero:true,
lineStyle:lineStyleProperties(),
},
axisTick:{
show:true,
alignWithLabel:true,
inside:false,
length:1,
lineStylelineStyleProperties(),
},
minorTick:{
show:true,
splitNumber:0,
length:1,
lineStyle:lineStyleProperties(),
},
axisLabel:{
show:true,
inside:true,
rotate:0
margin:0,
interval:1, //number or function or auto
formatter:"", // String or Function {yyyy},{yy},{Q},{MMMM},{MMM},{MM},{M},
{dd},{d},{eeee},{ee},{e},{HH},{H},{hh},{h},{mm},{m},{ss},{s},{SSS},{S},{A},{a}.
showMinLabel:false,
showMaxLabel:false,
 alignMinLabel:"left", //left or center or right or null
alignMaxLabel:"left", //left or center or right or null
hideOverlap:true,
...styleProperties(),
},
splitLine:{
show:true,
showMinLine:true,
showMaxLabel :false,
lineStyle:lineStyleProperties(),
},
minorSplitLine:{
show:true,
lineStyle:lineStyleProperties(),
},
splitArea:{
show:true,
areaStyle:shadowStyleProperties(),
},
data: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday',
'Sunday'], // Array or
data: [{
value: 'Monday',
textStyle: styleProperties(),
}, 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
axisPointer:{
show:true,
type:"line", // line or shadow or none
snap:false,
z:0,
triggerEmphasis:false,
triggerTooltip:false,
value:0,
status:true,
label:{
show :true,
precision:"auto" , // number or auto
margin:0,
...styleProperties(),
},
lineStyle:lineStyleProperties(),
shadowStyle:shadowStyleProperties(),
},
tooltip:{
show:true,
backgroundColor:"",
borderColor:"",
borderWidth:0,
padding:0,
textStyle:styleProperties(),
},
animation:true,
animationThreshold:0,
animationDuration:0,
animationDurationUpdate:0,
zlevel:0,
z:0,
});
export const legendCommon = () => ({
type:"plain",// plain or scroll
show:true,
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto" , // auto or number
height :"auto" , // auto or number
orient:"horizontal", // horizontal or vertical
align:"auto" , // auto or left or right
padding:[0,0,0,0], // array or number
itemGap"0,
itemWidth:10,
itemHeight:10,
itemStyle:{
color:"inherit", // color or inherit
borderColor:"inherit", // color or inherit
borderWidth :"auto" , // auto or number
borderType:"inherit", // inherit or solid or dashed or dotted
shadowColor:"",
shadowBlur:0,
shadowOffsetX:0,
shadowOffsetY:0,
opacity:1,
},
textStyle:styleProperties(),
icon:"circle", //circle or rect or roundRect or triangle or diamond or pin or
arrow or none
});

export const gridCommon = () => ({

show:true,
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto" , // auto or number
height :"auto" , // auto or number
containLabel:false,
backgroundColor:"transparent", // color or transparent
borderColor:"transparent", // color or transparent
borderWidth:0,
shadowColor:"",
shadowBlur:0,
shadowOffsetX:0,
shadowOffsetY:0,
});

export const tooltipCommon = () => ({

show: true,
trigger: "item", // item or axis or none
showContent:true,
alwaysShowContent:true,
triggerOn:"mousemove|click", // mousemove or click or mousemove|click or none
 showDelay:0,
hideDelay:0,
enterable:true,
backgroundColor:"", // color
borderColor: "" , // color
borderWidth:0,
padding: 0,
order:"seriesAsc", // seriesAsc or seriesDesc or valueAsc or valueDesc
textStyle: styleProperties(),
axisPointer:{
show:true,
type:"line", // line or shadow or none or cross
snap:false,
z:0,
label:{
show :true,
precision:"auto" , // number or auto
margin:0,
...styleProperties(),
},
lineStyle:lineStyleProperties(),
shadowStyle:shadowStyleProperties(),
crossStyle:lineStyleProperties(),
animation:true,
animationThreshold:1000,
animationDuration :1000, // number or Function

},
});

export const axisPointerCommon = () => ({

show:true,
type:"line", // line or shadow or none or cross
snap:false,
z:0,
label:{
show :true,
precision:"auto" , // number or string or auto
margin:0,
...styleProperties(),
},
lineStyle:lineStyleProperties(),
shadowStyle:shadowStyleProperties(),
crossStyle:lineStyleProperties(),
triggerTooltip:true,
value:0,
status:"show", // show or hide
triggerOn:"mousemove|click", // mousemove or click or mousemove|click or
none
handle:{
show:true,
icon:"", // any
size:0,
margin:0
color:"",
shadowColor:"",
shadowBlur:0,
shadowColor:"",
shadowOffsetX:0,
 shadowOffsetY:0,
opacity:0,
},

});

export const toolboxCommon = () => ({

show: true,
orient: "horizontal", // horizontal or vertical
showTitle:true,
itemSize:0,
itemGap:0,
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
feature:{
saveAsImage:{
show:true,
type:"png", // png or jpg or svg
name:"", //String default value is title.text
backgroundColor:"auto", // auto or color
title:"",
icon:"", // Any For Images image://http://example.website/a/b.png'
iconStyle:iconStyleProperties(),
pixelRatio:1,
},
restore:{
show:true,
title:"",
icon:"",// Any For Images image://http://example.website/a/b.png'
iconStyle:iconStyleProperties(),
},
dataView:{
show:true,
title:"",
icon:"",// Any For Images image://http://example.website/a/b.png'
iconStyle:iconStyleProperties(),
readOnly:false,
optionToContent: , // Function
lang :['data view', 'turn off', 'refresh'], // array
backgroundColor:"",
textareaColor:"",
textareaBorderColor:"",
textColor:"",
buttonColor:"",
buttonTextColor:"",
},
dataZoom:{
show:true,
title:"",
icon:"",// Any For Images image://http://example.website/a/b.png'
iconStyle:iconStyleProperties(),
filterMode:"filter",
xAxisIndex:0, // number or array or boolean
 yAxisIndex:0, // number or array or boolean
brushStyle:iconStyleProperties(),
},
},
iconStyle:iconStyleProperties(),
emphasis:{
iconStyle:{
...iconStyleProperties(),
textPosition:"bottom", // left or right or top or bottom
textFill :"", // color
textAlign :"center",
textBackgroundColor:"",
textBorderRadius:"",
textPadding:0,
}
},

});

export const seriesCommonData =(type)=>({

type, // line or bar or pie or scatter or effectScatter or radar or tree or
treemap or sunburst or boxplot or candlestick or heatmap or map or parallel or
lines or graph or sankey or funnel or gauge or pictorialBar or themeRiver or custom
name:"",
colorBy:"series", // series or data
coordinateSystem:"cartesian2d", // cartesian2d or polar
legendHoverLink:false,
zlevel:0,
z:0,
silent:false, // ignore mouse events.
animation:true,
animationThreshold:1000,
animationDuration:1000,
labelLayout:labelLayout(),
itemStyle:iconStyleProperties(),
selectedMode:false, // boolean or single or multiple or series
sampling:"lttb", // lttb or average or min or max or minmax or sum
seriesLayoutBy:"column", // column or row
data:[{name:"",value:1,},{name:"",value:2,}],
})

export const lineChartSeriesData =()=>({

symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
symbolRotate:0,
showSymbol:false,
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
smooth:false, // boolean or number
step:true , // true or false or start or middle or end
...seriesCommonData({type:"line"}),
labelLine:{
showAbove:true,
length2:0,
smooth:true, // Boolean or 0-1
minTurnAngle:0,
 ...labelLine(),
},
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
endLabel:endLabel(),
areaStyle:{
origin:"auto", //auto or start or end or number
...shadowStyleProperties(),
},
emphasis: {
scale:false,
...emphasisStyles(),
areaStyle:shadowStyleProperties(),
lineStyle:lineStyleProperties(),
endLabel:endLabel(),
},
blur: {
...blurStyles(),
areaStyle:shadowStyleProperties(),
lineStyle:lineStyleProperties(),
endLabel:endLabel(),
},
select: {
...selectStyles(),
areaStyle:shadowStyleProperties(),
lineStyle:lineStyleProperties(),
endLabel:endLabel(),
},
})

export const barChartSeriesData =()=>({

...seriesCommonData({type:"bar"}),
roundCap:false,
realtimeSort:false,
showBackground:false,
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
label:labelStyles(),
backgroundStyle:iconStyleProperties(),
labelLine:labelLine(),
emphasis:emphasisStyles(),
stack:"",
stackStrategy:"samesign", // samesign or all or positive or negative
barWidth:1, // number or string
barMaxWidth:1, // number or string
barMinWidth:1, // number or string
barMinHeight:0,
barMinAngle:0,
barGap:"20%",
large:true,
progressive:5000,
progressiveThreshold :2000,
progressiveChunkMode:"mod", // mod or sequential
 clip:true,
})

export const pieChartSeriesData =()=>({

...seriesCommonData({type:"pie"}),
geoIndex:0,
calendarIndex:0,
clockwise:true,
startAngle:0,
endAngle:"auto", // auto or number or string
minAngle:0,
padAngle:0,
minShowLabelAngle:0,
roseType:"radius", // radius or area
avoidLabelOverlap:true,
stillShowZeroSum:true,
percentPrecision:2,
center:['50%', '50%'],
radius : [0, '75%'],
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
showEmptyCircle:true,
emptyCircleStyle:iconStyleProperties(),
label:{
position:"outside", // outside or inside or center
edgeDistance:20, // string or number
bleedMargin:10,
distanceToLabelLine:0,

...labelStyles(),
},
labelLine:{
showAbove:true,
length:0,
length2:0,
smooth:true, // Boolean or 0-1
minTurnAngle:0,
maxSurfaceAngle:0,
...labelLine(),
},
emphasis: {
scale:false,
scaleSize:10,
...emphasisStyles(),

},
blur: blurStyles(),
select:selectStyles(),

})

export const scatterChartSeriesData =()=>({

...seriesCommonData({type:"scatter"}),
xAxisIndex:0, // if multiple x axis
 yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
geoIndex:0,
calendarIndex:0,
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
symbolRotate:0,
showSymbol:false,
large:true,
labelLine:{
showAbove:true,
length2:0,
smooth:true, // Boolean or 0-1
minTurnAngle:0,
...labelLine(),
},
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
emphasis: {
scale:false,
...emphasisStyles(),
},
blur:blurStyles(),
select:selectStyles(),
progressive:5000,
progressiveThreshold :2000,
})

export const effectScatterChartSeriesData =()=>({

...seriesCommonData({type:"effectScatter"}),
effectType:"ripple",
showEffectOn:"render", // render or emphasis
rippleEffect:{
color:"",
number:0,
period:2,
scale:2.5,
brushType:"fill" , // fill or stroke
},
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
geoIndex:0,
calendarIndex:0,
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
symbolRotate:0,
labelLine:{
showAbove:true,
length2:0,
smooth:true, // Boolean or 0-1
minTurnAngle:0,
...labelLine(),
 },
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
emphasis: {
scale:false,
...emphasisStyles(),
},
blur:blurStyles(),
select:selectStyles(),
progressive:5000,
progressiveThreshold :2000,
})

export const radarChartSeriesData =()=>({

...seriesCommonData({type:"radar"}),
radarIndex:0, // Index of radar component that radar chart uses.
symbol:"circle", // circle or rect or roundRect or triangle or diamond or pin
or arrow or none
symbolSize:0,
symbolRotate:0,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
areaStyle:shadowStyleProperties(),
emphasis: {
scale:false,
...emphasisStyles(),
lineStyle:lineStyleProperties(),
areaStyle:shadowStyleProperties(),
},
blur:{
...blurStyles(),
lineStyle:lineStyleProperties(),
areaStyle:shadowStyleProperties(),
},
select:{
...selectStyles(),
lineStyle:lineStyleProperties(),
areaStyle:shadowStyleProperties(),
},
})

export const treeChartSeriesData =()=>({

type:"tree",
name:"",
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
 width:"auto", // auto or number
height:"auto", // auto or number
center:['50%', '50%'],
zoom:1,
layout:"orthogonal", // orthogonal or radial
orient:"LR", // LR or RL or TB or BT
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or triangle
or diamond or pin or arrow or none
symbolSize:0,
symbolRotate:0,
edgeShape:"curve", // curve or polyline
roam:true, // boolean or scale or move
expandAndCollapse:true,
initialTreeDepth:0,
itemStyle:iconStyleProperties(),
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
labelLayout:labelLayout(),
itemStyle:iconStyleProperties(),
lineStyle:lineStyleProperties(),
emphasis:{
...emphasisStyles(),
lineStyle:lineStyleProperties(),
},
blur:{
...blurStyles(),
lineStyle:lineStyleProperties(),
},
select:{
...selectStyles(),
lineStyle:lineStyleProperties(),
},
leaves:{
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
labelLayout:labelLayout(),
itemStyle:iconStyleProperties(),
lineStyle:lineStyleProperties(),
emphasis:{
...emphasisStyles(),
lineStyle:lineStyleProperties(),
},
blur:{
...blurStyles(),
lineStyle:lineStyleProperties(),
},
select:{
...selectStyles(),
lineStyle:lineStyleProperties(),
},
},
 data:[{name:"",value:0,collapsed:true,}]
silent:false, // ignore mouse events.
animation:true,
animationThreshold:1000,
animationDuration:1000,
})

export const treemapChartSeriesData =()=>({

type:"treemap",
name:"",
zlevel:0,
z:0,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
squareRatio:0
leafDepth:1,
drillDownIcon:"▶",
visualDimension:0,
visualMin:0,
visualMax:0,
color :"",
colorAlpha:[0,1], // 0 - 1
colorSaturation:[0,1], // 0 - 1
roam:true, // boolean or scale or move
scaleLimit:{
min:0,
max:0
},
nodeClick:"zoomToNode", // boolean or link or zoomToNode
zoomToNodeRatio:0.32*0.32,
colorMappingBy:"index", // Index or value or id
visibleMin:10,
childrenVisibleMin:10,
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
labelLayout:labelLayout(),
itemStyle:iconStyleProperties(),
lineStyle:lineStyleProperties(),
emphasis:{
...emphasisStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
blur:{
...blurStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
select:{
...selectStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
breadcrumb:{
show:true,
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
height:22,
emptyItemWidth:22,
itemStyle:iconStyleProperties(),
emphasis:{itemStyle:iconStyleProperties(),},

},
labelLine:{
showAbove:true,
length2:0,
smooth:true, // Boolean or 0-1
minTurnAngle:0,
maxSurfaceAngle:0,
...labelLine(),
},
levels:{
visualDimension:0,
visualMin:0,
visualMax:0,
color :"",
colorAlpha:[0,1], // 0 - 1
colorSaturation:[0,1], // 0 - 1
visibleMin:10,
childrenVisibleMin:10,
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
itemStyle:iconStyleProperties(),
emphasis:{
...emphasisStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
blur:{
...blurStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
select:{
...selectStyles(),
upperLabel:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
},
},
},
data:[{name:"",value:0,collapsed:true,}]
silent:false, // ignore mouse events.
animation:true,
animationThreshold:1000,
animationDuration:1000,
})

export const sunburstChartSeriesData =()=>({

type:"sunburst",
name:"",
zlevel:0,
z:0,
center:['50%', '50%'],
radius : [0, '75%'], // number or string or array
nodeClick:"rootToNode", // rootToNode or link or boolean
sort:"desc", // desc or asc or null or Function
renderLabelForZeroData:true,
clockwise:true,
startAngle:90,
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
align:"center",// left or center or right
},
 labelLayout:labelLayout(),
itemStyle:iconStyleProperties(),
lineStyle:lineStyleProperties(),
emphasis:emphasisStyles(),
blur:blurStyles()
select:selectStyles(),
levels:{
radius : [0, '75%'], // number or string or array
label:{
...labelStyles(),
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
align:"center",// left or center or right
},
itemStyle:iconStyleProperties(),
labelLine:labelLine(),
emphasis:emphasisStyles(),
blur:blurStyles()
select:selectStyles(),
},
data:[{name:"",value:0,collapsed:true,}]
animation:true,
animationThreshold:1000,
animationDuration:1000,
})

export const boxplotChartSeriesData =()=>({

...seriesCommonData({type:"boxplot"}),
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
layout:"horizontal", // horizontal or vertical
boxWidth:[7, 50], // [min, max]
itemStyle:iconStyleProperties(),
emphasis:{
disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
itemStyle:iconStyleProperties(),
},
blur:{
itemStyle:iconStyleProperties(),
},
select:{
disabled:false,
itemStyle:iconStyleProperties(),
},
})

export const candlestickChartSeriesData =()=>({

...seriesCommonData({type:"candlestick"}),
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
layout:"horizontal", // horizontal or vertical
barWidth:1, // number or string
barMaxWidth:1, // number or string
barMinWidth:1, // number or string
 large:true,
largeThreshold:600,
progressive:5000,
progressiveThreshold :2000,
progressiveChunkMode:"mod", // mod or sequential
clip:true,
itemStyle:iconStyleProperties(),
emphasis:{
disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
itemStyle:iconStyleProperties(),
},
blur:{
itemStyle:iconStyleProperties(),
},
select:{
disabled:false,
itemStyle:iconStyleProperties(),
},
})

export const heatmapChartSeriesData =()=>({

...seriesCommonData({type:"heatmap"}),
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
geoIndex:0,
calendarIndex:0,
pointSize:20,
blurSize:20,
minOpacity:0,
maxOpacity:1,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
emphasis: {
disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},

},
blur: {
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
 ...labelStyles(),
},

},
select: {
disabled:false,
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},

},
universalTransition:{
enabled:true,
seriesKey:['male', 'female'], // string or array
divideShape:"split", // split or clone

},
progressive:5000,
progressiveThreshold :2000,
})

export const parallelChartSeriesData =()=>({

...seriesCommonData({type:"parallel"}),
parallelIndex:0,
smooth:false, // boolean or number
inactiveOpacity:0.1, // 0-1
activeOpacity::0.1, // 0-1
realtime:true,
progressive:500,
progressiveThreshold:1000,
progressiveChunkMode:"mod", // mod or sequential
lineStyle:lineStyleProperties(),
emphasis: {
disabled:false,
lineStyle:lineStyleProperties(),
},

})

export const linesChartSeriesData =()=>({

...seriesCommonData({type:"lines"}),
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
geoIndex:0, //multiple geographic axes
polyline:false,
progressive:500,
progressiveThreshold:1000,
clip:true,
effect:{
show:true,
 period:0,
delay:0, // number or Function
constantSpeed:0,
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
color:"",
trailLength:0,
loop :false,
roundTrip:false,
},
large:true,
largeThreshold:100,
smooth:false, // boolean or number

label:{
position:"start", // start or middle or end
minMargin:0,
...styleProperties(),
},
lineStyle:lineStyleProperties(),
emphasis: {
disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
lineStyle:lineStyleProperties(),
label:{
position:"start", // start or middle or end
minMargin:0,
...styleProperties(),
},

},
blur: {
.lineStyle:lineStyleProperties(),
label:{
position:"start", // start or middle or end
minMargin:0,
...styleProperties(),
},

},
select: {
disabled:false,
lineStyle:lineStyleProperties(),
label:{
position:"start", // start or middle or end
minMargin:0,
...styleProperties(),
},

},
})

export const graphChartSeriesData =()=>({

...seriesCommonData({type:"graph"}),
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
 symbolSize:0,
symbolRotate:0,
xAxisIndex:0, // if multiple x axis
yAxisIndex:0, // if multiple y axis
polarIndex:0, // if multiple polar axis
geoIndex:0, //multiple geographic axes
calendarIndex:0,//multiple calendar coordinates
center:[115.97, '30%'], // array
zoom :0,
layout:"none", //none or circular or force
circular:{rotateLabel:false,},
roam:true, // boolean or scale or move
scaleLimit:{
min:0,
max:0,
},
nodeScaleRatio:0,
draggable:false,
autoCurveness: false,
nodes:[],
links:[],
edges:[],
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
position:"start", // start or middle or end
...styleProperties(),
},
emphasis: {
scale:false,
...emphasisStyles(),
edgeLabel:{
show:true,
position:"start", // start or middle or end
...styleProperties(),
},
lineStyle:lineStyleProperties(),
},
blur: {
...blurStyles(),
edgeLabel:{
show:true,
position:"start", // start or middle or end
...styleProperties(),
},
lineStyle:lineStyleProperties(),
},
 select: {
...selectStyles(),
edgeLabel:{
show:true,
position:"start", // start or middle or end
...styleProperties(),
},
lineStyle:lineStyleProperties(),
},
categories:[{
name:"",
symbol:"emptyCircle", // emptyCircle or circle or rect or roundRect or
triangle or diamond or pin or arrow or none
symbolSize:0,
symbolRotate:0,
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
emphasis: {
disabled:false,
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
},
blur: {
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},

},
select: {
disabled:false,
itemStyle:iconStyleProperties(),
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},

},
}]
})

export const sankeyChartSeriesData =()=>({

...seriesCommonData({type:"sankey"}),
 left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
nodeWidth:0,
nodeGap:0,
nodeAlign:"justify", // justify or left or right
layoutIterations:0,
orient :"horizontal", // horizontal or vertical
draggable:true,
nodes:[],
edges:[],
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
levels:[{
depth:0,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
lineStyle:lineStyleProperties(),
itemStyle:iconStyleProperties(),
emphasis: {
disabled:false,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
 ...styleProperties(),
},
itemStyle:iconStyleProperties(),
},
blur: {
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
itemStyle:iconStyleProperties(),

},
select: {
disabled:false,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
itemStyle:iconStyleProperties(),
},

}],
emphasis: {
disabled:false,
focus:"none", // none or self or series
blurScope:"coordinateSystem", // coordinateSystem or series or global
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
 },
itemStyle:iconStyleProperties(),
},
blur: {
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
itemStyle:iconStyleProperties(),

},
select: {
disabled:false,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or insideTop or insideBottom or insideTopLeft or
insideBottomLeft or insideTopRight or insideBottomRight
...labelStyles(),
},
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
itemStyle:iconStyleProperties(),
},
links:[{
source:"",
target:"",
value:0,
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
emphasis: {
disabled:false,
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
 ...styleProperties(),
},
},
blur: {
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},

},
select: {
disabled:false,
lineStyle:lineStyleProperties(),
edgeLabel:{
show:true,
rotate:0,
distance:0,
offset:[0,0],
...styleProperties(),
},
},

}]
})

export const funnelChartSeriesData =()=>({

...seriesCommonData({type:"funnel"}),
min:0,
max:100,
minSize:"0%", // number or String
maxSize:"100%", // number or String
orient:"vertical", // vertical or horizontal
sort:"descending", // descending or ascending or none
gap:0,
funnelAlign:"left", // left or right or center
left:"auto", // auto or left or center or right or number
right:"auto", // auto or left or center or right or number
top:"auto", // auto or top or middle or bottom or number
bottom:"auto", // auto or top or middle or bottom or number
width:"auto", // auto or number
height:"auto", // auto or number
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or leftTop or leftBottom or rightTop or rightBottom
...labelStyles(),
},
labelLine:{
show:true,
length:0,
lineStyle:lineStyleProperties(),
},
emphasis: {
disabled:false,
focus:"none", // none or self or series
 blurScope:"coordinateSystem", // coordinateSystem or series or global
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or leftTop or leftBottom or rightTop or rightBottom
...labelStyles(),
},
labelLine:{
show:true,
length:0,
lineStyle:lineStyleProperties(),
},
itemStyle:iconStyleProperties(),
},
blur: {
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or leftTop or leftBottom or rightTop or rightBottom
...labelStyles(),
},
labelLine:{
show:true,
length:0,
lineStyle:lineStyleProperties(),
},
itemStyle:iconStyleProperties(),
},
select: {
disabled:false,
label:{
position:"top", // top or left or right or bottom or inside or
insideLeft or insideRight or leftTop or leftBottom or rightTop or rightBottom
...labelStyles(),
},
labelLine:{
show:true,
length:0,
lineStyle:lineStyleProperties(),
},
itemStyle:iconStyleProperties(),

},

})

export const gaugeChartSeriesData =()=>({

type:"gauge",
name:"",
colorBy:"series", // series or data
coordinateSystem:"cartesian2d", // cartesian2d or polar
legendHoverLink:false,
zlevel:0,
z:0,
silent:false, // ignore mouse events.
animation:true,
animationThreshold:1000,
animationDuration:1000,
selectedMode:false, // boolean or single or multiple or series
sampling:"lttb", // lttb or average or min or max or minmax or sum
seriesLayoutBy:"column", // column or row
center:['50%', '50%'],
radius :'75%', // number or string
startAngle :20,
endAngle:40,
clockwise:true,
data:[{
name:"",
value:"",
title:{
show:true,
offsetCenter:[0, '20%'],
...styleProperties(),
},
detail:{
show:true,
offsetCenter:[0, '20%'],
...styleProperties(),
},
itemStyle:iconStyleProperties(),

}],
min:0,
max:100,
splitNumber:10,
axisLine:{
show:true,
roundCap:true,
lineStyle:lineStyleProperties(),
},
progress:{
show:true,
overlap:true,
width:10,
roundCap:true,
clip:true,
itemStyle:iconStyleProperties(),
},
splitLine:{
show:true,
length:10,
distance:10,
lineStyle:lineStyleProperties(),
},
axisTick:{
show:true,
splitNumber:0,
length:0, // number or string
distance:0,
lineStyle:lineStyleProperties(),
},
axisLabel:{
show:true,
rotate:0, // number or string
distance:0,
...styleProperties(),
},
 pointer:{
show:true,
showAbove:true,
icon:"",
offsetCenter : [0, 0],
length:0,
width:0,
itemStyle:iconStyleProperties(),
},
anchor:{
show:true,
showAbove:true,
size:0,
icon:"",
offsetCenter : [0, 0],
itemStyle:iconStyleProperties(),
},
itemStyle:iconStyleProperties(),
emphasis:{
disabled:false,
itemStyle:iconStyleProperties(),
},
title:{
show:true,
offsetCenter : [0, 0],
...styleProperties(),
},
detail:{
show:true,
...styleProperties(),
},

})