2472 lines
61 KiB
JSON
2472 lines
61 KiB
JSON
{
|
|
"version": "sha256:d161e0f4c0364c1283a414092d71a239e13381c28c855b96673d8523c3c43ce2",
|
|
"source": "D:\\my-v0\\src\\materials",
|
|
"components": [
|
|
{
|
|
"key": "bar-chart",
|
|
"type": "bar-chart",
|
|
"name": "柱状图",
|
|
"description": "柱状图物料,默认配置及属性设置来自前端 src/materials/charts/bar.ts",
|
|
"tags": [
|
|
"charts",
|
|
"柱状图",
|
|
"bar-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:chart-2-bold",
|
|
"schema": {
|
|
"type": "bar-chart",
|
|
"name": "柱状图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "销售额统计",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"month": "一月",
|
|
"sales": 120
|
|
},
|
|
{
|
|
"month": "二月",
|
|
"sales": 200
|
|
},
|
|
{
|
|
"month": "三月",
|
|
"sales": 150
|
|
},
|
|
{
|
|
"month": "四月",
|
|
"sales": 80
|
|
},
|
|
{
|
|
"month": "五月",
|
|
"sales": 170
|
|
},
|
|
{
|
|
"month": "六月",
|
|
"sales": 240
|
|
}
|
|
]
|
|
},
|
|
"grid": {
|
|
"top": 86,
|
|
"right": 24,
|
|
"bottom": 32,
|
|
"left": 48,
|
|
"containLabel": true
|
|
},
|
|
"xAxis": {
|
|
"type": "category",
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"yAxis": {
|
|
"type": "value",
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "销售额",
|
|
"type": "bar",
|
|
"barWidth": "45%",
|
|
"encode": {
|
|
"x": "month",
|
|
"y": "sales"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#ffffff",
|
|
"borderRadius": [
|
|
4,
|
|
4,
|
|
0,
|
|
0
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "柱颜色",
|
|
"key": "props.option.series.0.itemStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "X字段",
|
|
"key": "props.option.series.0.encode.x"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "Y字段",
|
|
"key": "props.option.series.0.encode.y"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "上边距",
|
|
"key": "props.option.grid.top",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "右边距",
|
|
"key": "props.option.grid.right",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "下边距",
|
|
"key": "props.option.grid.bottom",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "左边距",
|
|
"key": "props.option.grid.left",
|
|
"span": 12
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/bar.ts"
|
|
},
|
|
{
|
|
"key": "hbar-chart",
|
|
"type": "hbar-chart",
|
|
"name": "条形图",
|
|
"description": "条形图物料,默认配置及属性设置来自前端 src/materials/charts/hbar.ts",
|
|
"tags": [
|
|
"charts",
|
|
"条形图",
|
|
"hbar-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:align-left-bold",
|
|
"schema": {
|
|
"type": "hbar-chart",
|
|
"name": "条形图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "地区销售额",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"region": "华东",
|
|
"sales": 320
|
|
},
|
|
{
|
|
"region": "华南",
|
|
"sales": 240
|
|
},
|
|
{
|
|
"region": "华北",
|
|
"sales": 210
|
|
},
|
|
{
|
|
"region": "西南",
|
|
"sales": 180
|
|
},
|
|
{
|
|
"region": "西北",
|
|
"sales": 130
|
|
}
|
|
]
|
|
},
|
|
"grid": {
|
|
"top": 86,
|
|
"right": 24,
|
|
"bottom": 24,
|
|
"left": 48,
|
|
"containLabel": true
|
|
},
|
|
"xAxis": {
|
|
"type": "value",
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"yAxis": {
|
|
"type": "category",
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "销售额",
|
|
"type": "bar",
|
|
"barWidth": "45%",
|
|
"encode": {
|
|
"x": "sales",
|
|
"y": "region"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#38bdf8",
|
|
"borderRadius": [
|
|
0,
|
|
4,
|
|
4,
|
|
0
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "条颜色",
|
|
"key": "props.option.series.0.itemStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "X字段",
|
|
"key": "props.option.series.0.encode.x"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "Y字段",
|
|
"key": "props.option.series.0.encode.y"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "上边距",
|
|
"key": "props.option.grid.top",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "右边距",
|
|
"key": "props.option.grid.right",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "下边距",
|
|
"key": "props.option.grid.bottom",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "左边距",
|
|
"key": "props.option.grid.left",
|
|
"span": 12
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/hbar.ts"
|
|
},
|
|
{
|
|
"key": "area-chart",
|
|
"type": "area-chart",
|
|
"name": "面积图",
|
|
"description": "面积图物料,默认配置及属性设置来自前端 src/materials/charts/area.ts",
|
|
"tags": [
|
|
"charts",
|
|
"面积图",
|
|
"area-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:graph-new-bold",
|
|
"schema": {
|
|
"type": "area-chart",
|
|
"name": "面积图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "成交额趋势",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "axis"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"date": "周一",
|
|
"revenue": 120
|
|
},
|
|
{
|
|
"date": "周二",
|
|
"revenue": 200
|
|
},
|
|
{
|
|
"date": "周三",
|
|
"revenue": 150
|
|
},
|
|
{
|
|
"date": "周四",
|
|
"revenue": 260
|
|
},
|
|
{
|
|
"date": "周五",
|
|
"revenue": 330
|
|
},
|
|
{
|
|
"date": "周六",
|
|
"revenue": 420
|
|
},
|
|
{
|
|
"date": "周日",
|
|
"revenue": 510
|
|
}
|
|
]
|
|
},
|
|
"grid": {
|
|
"top": 86,
|
|
"right": 24,
|
|
"bottom": 32,
|
|
"left": 48,
|
|
"containLabel": true
|
|
},
|
|
"xAxis": {
|
|
"type": "category",
|
|
"boundaryGap": false,
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"yAxis": {
|
|
"type": "value",
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "成交额",
|
|
"type": "line",
|
|
"smooth": true,
|
|
"symbolSize": 8,
|
|
"encode": {
|
|
"x": "date",
|
|
"y": "revenue"
|
|
},
|
|
"lineStyle": {
|
|
"width": 3,
|
|
"color": "#ffffff"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#ffffff"
|
|
},
|
|
"areaStyle": {
|
|
"color": "rgba(34, 211, 238, 0.25)"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "线颜色",
|
|
"key": "props.option.series.0.lineStyle.color"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "面积色",
|
|
"key": "props.option.series.0.areaStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "X字段",
|
|
"key": "props.option.series.0.encode.x"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "Y字段",
|
|
"key": "props.option.series.0.encode.y"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "上边距",
|
|
"key": "props.option.grid.top",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "右边距",
|
|
"key": "props.option.grid.right",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "下边距",
|
|
"key": "props.option.grid.bottom",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "左边距",
|
|
"key": "props.option.grid.left",
|
|
"span": 12
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/area.ts"
|
|
},
|
|
{
|
|
"key": "line-chart",
|
|
"type": "line-chart",
|
|
"name": "折线图",
|
|
"description": "折线图物料,默认配置及属性设置来自前端 src/materials/charts/line.ts",
|
|
"tags": [
|
|
"charts",
|
|
"折线图",
|
|
"line-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:graph-up-bold",
|
|
"schema": {
|
|
"type": "line-chart",
|
|
"name": "折线图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "访问量趋势",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "axis"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"date": "周一",
|
|
"visits": 820
|
|
},
|
|
{
|
|
"date": "周二",
|
|
"visits": 932
|
|
},
|
|
{
|
|
"date": "周三",
|
|
"visits": 901
|
|
},
|
|
{
|
|
"date": "周四",
|
|
"visits": 934
|
|
},
|
|
{
|
|
"date": "周五",
|
|
"visits": 1290
|
|
},
|
|
{
|
|
"date": "周六",
|
|
"visits": 1330
|
|
},
|
|
{
|
|
"date": "周日",
|
|
"visits": 1320
|
|
}
|
|
]
|
|
},
|
|
"grid": {
|
|
"top": 86,
|
|
"right": 24,
|
|
"bottom": 32,
|
|
"left": 48,
|
|
"containLabel": true
|
|
},
|
|
"xAxis": {
|
|
"type": "category",
|
|
"boundaryGap": false,
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"yAxis": {
|
|
"type": "value",
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "访问量",
|
|
"type": "line",
|
|
"smooth": true,
|
|
"symbolSize": 8,
|
|
"encode": {
|
|
"x": "date",
|
|
"y": "visits"
|
|
},
|
|
"lineStyle": {
|
|
"width": 3,
|
|
"color": "#38bdf8"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#38bdf8"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "线颜色",
|
|
"key": "props.option.series.0.lineStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "X字段",
|
|
"key": "props.option.series.0.encode.x"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "Y字段",
|
|
"key": "props.option.series.0.encode.y"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "上边距",
|
|
"key": "props.option.grid.top",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "右边距",
|
|
"key": "props.option.grid.right",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "下边距",
|
|
"key": "props.option.grid.bottom",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "左边距",
|
|
"key": "props.option.grid.left",
|
|
"span": 12
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/line.ts"
|
|
},
|
|
{
|
|
"key": "pie-chart",
|
|
"type": "pie-chart",
|
|
"name": "饼图",
|
|
"description": "饼图物料,默认配置及属性设置来自前端 src/materials/charts/pie.ts",
|
|
"tags": [
|
|
"charts",
|
|
"饼图",
|
|
"pie-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:pie-chart-2-bold",
|
|
"schema": {
|
|
"type": "pie-chart",
|
|
"name": "饼图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"color": [
|
|
"#ffffff",
|
|
"#a78bfa",
|
|
"#f59e0b",
|
|
"#34d399",
|
|
"#fb7185"
|
|
],
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "访问来源占比",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "item"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"channel": "搜索引擎",
|
|
"value": 1048
|
|
},
|
|
{
|
|
"channel": "直接访问",
|
|
"value": 735
|
|
},
|
|
{
|
|
"channel": "联盟广告",
|
|
"value": 484
|
|
},
|
|
{
|
|
"channel": "视频广告",
|
|
"value": 300
|
|
}
|
|
]
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "访问来源",
|
|
"type": "pie",
|
|
"center": [
|
|
"50%",
|
|
"62%"
|
|
],
|
|
"avoidLabelOverlap": true,
|
|
"label": {
|
|
"color": "#e2e8f0"
|
|
},
|
|
"labelLine": {
|
|
"lineStyle": {
|
|
"color": "#94a3b8"
|
|
}
|
|
},
|
|
"encode": {
|
|
"itemName": "channel",
|
|
"value": "value"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "主色",
|
|
"key": "props.option.color.0"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "名称字段",
|
|
"key": "props.option.series.0.encode.itemName"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "数值字段",
|
|
"key": "props.option.series.0.encode.value"
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/pie.ts"
|
|
},
|
|
{
|
|
"key": "ring-chart",
|
|
"type": "ring-chart",
|
|
"name": "环形图",
|
|
"description": "环形图物料,默认配置及属性设置来自前端 src/materials/charts/ring.ts",
|
|
"tags": [
|
|
"charts",
|
|
"环形图",
|
|
"ring-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:pie-chart-3-bold",
|
|
"schema": {
|
|
"type": "ring-chart",
|
|
"name": "环形图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"color": [
|
|
"#38bdf8",
|
|
"#a78bfa",
|
|
"#f59e0b",
|
|
"#34d399",
|
|
"#fb7185"
|
|
],
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "设备占比",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "item"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"device": "桌面端",
|
|
"value": 1048
|
|
},
|
|
{
|
|
"device": "移动端",
|
|
"value": 735
|
|
},
|
|
{
|
|
"device": "平板",
|
|
"value": 380
|
|
},
|
|
{
|
|
"device": "其他",
|
|
"value": 184
|
|
}
|
|
]
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "设备",
|
|
"type": "pie",
|
|
"radius": [
|
|
"42%",
|
|
"68%"
|
|
],
|
|
"center": [
|
|
"50%",
|
|
"62%"
|
|
],
|
|
"avoidLabelOverlap": true,
|
|
"label": {
|
|
"color": "#e2e8f0"
|
|
},
|
|
"labelLine": {
|
|
"lineStyle": {
|
|
"color": "#94a3b8"
|
|
}
|
|
},
|
|
"encode": {
|
|
"itemName": "device",
|
|
"value": "value"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "主色",
|
|
"key": "props.option.color.0"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "名称字段",
|
|
"key": "props.option.series.0.encode.itemName"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "数值字段",
|
|
"key": "props.option.series.0.encode.value"
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/ring.ts"
|
|
},
|
|
{
|
|
"key": "scatter-chart",
|
|
"type": "scatter-chart",
|
|
"name": "散点图",
|
|
"description": "散点图物料,默认配置及属性设置来自前端 src/materials/charts/scatter.ts",
|
|
"tags": [
|
|
"charts",
|
|
"散点图",
|
|
"scatter-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:chart-square-bold",
|
|
"schema": {
|
|
"type": "scatter-chart",
|
|
"name": "散点图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 260
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "用户与销售额",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "item"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"users": 12,
|
|
"sales": 32
|
|
},
|
|
{
|
|
"users": 28,
|
|
"sales": 48
|
|
},
|
|
{
|
|
"users": 35,
|
|
"sales": 41
|
|
},
|
|
{
|
|
"users": 47,
|
|
"sales": 72
|
|
},
|
|
{
|
|
"users": 58,
|
|
"sales": 66
|
|
},
|
|
{
|
|
"users": 69,
|
|
"sales": 88
|
|
},
|
|
{
|
|
"users": 81,
|
|
"sales": 94
|
|
},
|
|
{
|
|
"users": 90,
|
|
"sales": 80
|
|
}
|
|
]
|
|
},
|
|
"grid": {
|
|
"top": 86,
|
|
"right": 24,
|
|
"bottom": 32,
|
|
"left": 48,
|
|
"containLabel": true
|
|
},
|
|
"xAxis": {
|
|
"type": "value",
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"yAxis": {
|
|
"type": "value",
|
|
"axisLabel": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.18)"
|
|
}
|
|
}
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "样本",
|
|
"type": "scatter",
|
|
"symbolSize": 12,
|
|
"encode": {
|
|
"x": "users",
|
|
"y": "sales"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#38bdf8"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "点颜色",
|
|
"key": "props.option.series.0.itemStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "X字段",
|
|
"key": "props.option.series.0.encode.x"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "Y字段",
|
|
"key": "props.option.series.0.encode.y"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "上边距",
|
|
"key": "props.option.grid.top",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "右边距",
|
|
"key": "props.option.grid.right",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "下边距",
|
|
"key": "props.option.grid.bottom",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "左边距",
|
|
"key": "props.option.grid.left",
|
|
"span": 12
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/scatter.ts"
|
|
},
|
|
{
|
|
"key": "radar-chart",
|
|
"type": "radar-chart",
|
|
"name": "雷达图",
|
|
"description": "雷达图物料,默认配置及属性设置来自前端 src/materials/charts/radar.ts",
|
|
"tags": [
|
|
"charts",
|
|
"雷达图",
|
|
"radar-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:radar-2-bold",
|
|
"schema": {
|
|
"type": "radar-chart",
|
|
"name": "雷达图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 280
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "能力对比",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {},
|
|
"radar": {
|
|
"center": [
|
|
"50%",
|
|
"62%"
|
|
],
|
|
"radius": "58%",
|
|
"indicator": [
|
|
{
|
|
"name": "销售",
|
|
"max": 100
|
|
},
|
|
{
|
|
"name": "市场",
|
|
"max": 100
|
|
},
|
|
{
|
|
"name": "研发",
|
|
"max": 100
|
|
},
|
|
{
|
|
"name": "客服",
|
|
"max": 100
|
|
},
|
|
{
|
|
"name": "技术",
|
|
"max": 100
|
|
}
|
|
],
|
|
"axisName": {
|
|
"color": "#cbd5e1"
|
|
},
|
|
"splitLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.25)"
|
|
}
|
|
},
|
|
"splitArea": {
|
|
"areaStyle": {
|
|
"color": [
|
|
"rgba(148, 163, 184, 0.04)",
|
|
"rgba(148, 163, 184, 0.08)"
|
|
]
|
|
}
|
|
},
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"color": "rgba(148, 163, 184, 0.35)"
|
|
}
|
|
}
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"name": "产品A",
|
|
"sales": 80,
|
|
"market": 70,
|
|
"develop": 90,
|
|
"support": 85,
|
|
"tech": 75
|
|
},
|
|
{
|
|
"name": "产品B",
|
|
"sales": 65,
|
|
"market": 88,
|
|
"develop": 72,
|
|
"support": 78,
|
|
"tech": 92
|
|
}
|
|
]
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "能力",
|
|
"type": "radar",
|
|
"encode": {
|
|
"itemName": "name",
|
|
"value": [
|
|
"sales",
|
|
"market",
|
|
"develop",
|
|
"support",
|
|
"tech"
|
|
]
|
|
},
|
|
"lineStyle": {
|
|
"width": 2,
|
|
"color": "#38bdf8"
|
|
},
|
|
"itemStyle": {
|
|
"color": "#38bdf8"
|
|
},
|
|
"areaStyle": {
|
|
"color": "rgba(56, 189, 248, 0.18)"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "线颜色",
|
|
"key": "props.option.series.0.lineStyle.color"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "名称字段",
|
|
"key": "props.option.series.0.encode.itemName"
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/radar.ts"
|
|
},
|
|
{
|
|
"key": "funnel-chart",
|
|
"type": "funnel-chart",
|
|
"name": "漏斗图",
|
|
"description": "漏斗图物料,默认配置及属性设置来自前端 src/materials/charts/funnel.ts",
|
|
"tags": [
|
|
"charts",
|
|
"漏斗图",
|
|
"funnel-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:filter-bold",
|
|
"schema": {
|
|
"type": "funnel-chart",
|
|
"name": "漏斗图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 280
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"color": [
|
|
"#38bdf8",
|
|
"#a78bfa",
|
|
"#f59e0b",
|
|
"#34d399",
|
|
"#fb7185"
|
|
],
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true,
|
|
"textStyle": {
|
|
"color": "#cbd5e1"
|
|
}
|
|
},
|
|
"title": {
|
|
"text": "转化漏斗",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "item"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"stage": "访问",
|
|
"value": 100
|
|
},
|
|
{
|
|
"stage": "咨询",
|
|
"value": 72
|
|
},
|
|
{
|
|
"stage": "下单",
|
|
"value": 48
|
|
},
|
|
{
|
|
"stage": "成交",
|
|
"value": 26
|
|
}
|
|
]
|
|
},
|
|
"series": [
|
|
{
|
|
"name": "转化",
|
|
"type": "funnel",
|
|
"top": 72,
|
|
"bottom": 16,
|
|
"left": "12%",
|
|
"width": "76%",
|
|
"minSize": "16%",
|
|
"maxSize": "100%",
|
|
"sort": "descending",
|
|
"gap": 4,
|
|
"label": {
|
|
"color": "#e2e8f0"
|
|
},
|
|
"itemStyle": {
|
|
"borderColor": "transparent"
|
|
},
|
|
"encode": {
|
|
"itemName": "stage",
|
|
"value": "value"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "checkbox",
|
|
"label": "图例显示",
|
|
"key": "props.option.legend.show"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "主色",
|
|
"key": "props.option.color.0"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "名称字段",
|
|
"key": "props.option.series.0.encode.itemName"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "数值字段",
|
|
"key": "props.option.series.0.encode.value"
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/funnel.ts"
|
|
},
|
|
{
|
|
"key": "gauge-chart",
|
|
"type": "gauge-chart",
|
|
"name": "仪表盘",
|
|
"description": "仪表盘物料,默认配置及属性设置来自前端 src/materials/charts/gauge.ts",
|
|
"tags": [
|
|
"charts",
|
|
"仪表盘",
|
|
"gauge-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:speedometer-middle-bold",
|
|
"schema": {
|
|
"type": "gauge-chart",
|
|
"name": "仪表盘",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 320,
|
|
"height": 280
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"title": {
|
|
"text": "完成率",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"color": "#ffffff",
|
|
"fontSize": 16
|
|
}
|
|
},
|
|
"tooltip": {
|
|
"trigger": "item"
|
|
},
|
|
"dataset": {
|
|
"source": [
|
|
{
|
|
"name": "完成率",
|
|
"value": 72
|
|
}
|
|
]
|
|
},
|
|
"series": [
|
|
{
|
|
"type": "gauge",
|
|
"min": 0,
|
|
"max": 100,
|
|
"startAngle": 210,
|
|
"endAngle": -30,
|
|
"center": [
|
|
"50%",
|
|
"58%"
|
|
],
|
|
"radius": "80%",
|
|
"progress": {
|
|
"show": true,
|
|
"width": 12,
|
|
"itemStyle": {
|
|
"color": "#38bdf8"
|
|
}
|
|
},
|
|
"axisLine": {
|
|
"lineStyle": {
|
|
"width": 12,
|
|
"color": [
|
|
[
|
|
1,
|
|
"rgba(148, 163, 184, 0.22)"
|
|
]
|
|
]
|
|
}
|
|
},
|
|
"axisTick": {
|
|
"show": false
|
|
},
|
|
"splitLine": {
|
|
"length": 8,
|
|
"lineStyle": {
|
|
"width": 1,
|
|
"color": "#64748b"
|
|
}
|
|
},
|
|
"axisLabel": {
|
|
"color": "#cbd5e1",
|
|
"distance": 16
|
|
},
|
|
"pointer": {
|
|
"itemStyle": {
|
|
"color": "#ffffff"
|
|
}
|
|
},
|
|
"title": {
|
|
"offsetCenter": [
|
|
0,
|
|
"72%"
|
|
],
|
|
"color": "#cbd5e1",
|
|
"fontSize": 13
|
|
},
|
|
"detail": {
|
|
"valueAnimation": true,
|
|
"offsetCenter": [
|
|
0,
|
|
"46%"
|
|
],
|
|
"color": "#ffffff",
|
|
"fontSize": 28,
|
|
"formatter": "{value}%"
|
|
},
|
|
"encode": {
|
|
"itemName": "name",
|
|
"value": "value"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "标题",
|
|
"key": "props.option.title.text"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "标题色",
|
|
"key": "props.option.title.textStyle.color"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "对齐",
|
|
"key": "props.option.title.left",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "进度色",
|
|
"key": "props.option.series.0.progress.itemStyle.color"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "最小值",
|
|
"key": "props.option.series.0.min",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "最大值",
|
|
"key": "props.option.series.0.max",
|
|
"span": 12
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "名称字段",
|
|
"key": "props.option.series.0.encode.itemName"
|
|
},
|
|
{
|
|
"type": "input",
|
|
"label": "数值字段",
|
|
"key": "props.option.series.0.encode.value"
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示,不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作",
|
|
"setters 是属性面板配置,不是完整 JSON Schema"
|
|
],
|
|
"source_file": "src/materials/charts/gauge.ts"
|
|
},
|
|
{
|
|
"key": "text",
|
|
"type": "text",
|
|
"name": "文本",
|
|
"description": "文本物料,默认配置及属性设置来自前端 src/materials/text/index.ts",
|
|
"tags": [
|
|
"info",
|
|
"文本",
|
|
"text"
|
|
],
|
|
"renderer": "text",
|
|
"group": "info",
|
|
"icon": "solar:text-bold",
|
|
"schema": {
|
|
"type": "text",
|
|
"name": "文本",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 200,
|
|
"height": 50
|
|
},
|
|
"style": {
|
|
"color": "#fff",
|
|
"fontSize": 16,
|
|
"textAlign": "center",
|
|
"alignItems": "center"
|
|
},
|
|
"props": {
|
|
"content": "文本内容"
|
|
},
|
|
"events": [
|
|
{
|
|
"type": "click",
|
|
"title": "点击事件",
|
|
"name": "fn",
|
|
"code": "console.log(123)"
|
|
}
|
|
]
|
|
},
|
|
"setters": [
|
|
{
|
|
"type": "input",
|
|
"label": "内容",
|
|
"key": "props.content"
|
|
},
|
|
{
|
|
"type": "color",
|
|
"label": "颜色",
|
|
"key": "style.color"
|
|
},
|
|
{
|
|
"type": "number",
|
|
"label": "字号",
|
|
"key": "style.fontSize"
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "水平对齐",
|
|
"key": "style.textAlign",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "左对齐",
|
|
"value": "left"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "右对齐",
|
|
"value": "right"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "select",
|
|
"label": "垂直对齐",
|
|
"key": "style.alignItems",
|
|
"props": {
|
|
"options": [
|
|
{
|
|
"label": "顶部",
|
|
"value": "flex-start"
|
|
},
|
|
{
|
|
"label": "居中",
|
|
"value": "center"
|
|
},
|
|
{
|
|
"label": "底部",
|
|
"value": "flex-end"
|
|
}
|
|
]
|
|
}
|
|
}
|
|
],
|
|
"eventOptions": [
|
|
{
|
|
"label": "点击事件",
|
|
"value": "click"
|
|
},
|
|
{
|
|
"label": "双击事件",
|
|
"value": "dblclick"
|
|
},
|
|
{
|
|
"label": "鼠标进入事件",
|
|
"value": "mouseenter"
|
|
},
|
|
{
|
|
"label": "鼠标离开事件",
|
|
"value": "mouseleave"
|
|
},
|
|
{
|
|
"label": "鼠标按下事件",
|
|
"value": "mousedown"
|
|
},
|
|
{
|
|
"label": "鼠标抬起事件",
|
|
"value": "mouseup"
|
|
},
|
|
{
|
|
"label": "鼠标移动事件",
|
|
"value": "mousemove"
|
|
},
|
|
{
|
|
"label": "鼠标滚轮事件",
|
|
"value": "mousewheel"
|
|
},
|
|
{
|
|
"label": "生命周期事件",
|
|
"value": "vnodeMounted"
|
|
}
|
|
],
|
|
"sample_data": false,
|
|
"usage_notes": [
|
|
"events 中代码只作为资料保存,不由后端执行"
|
|
],
|
|
"source_file": "src/materials/text/index.ts"
|
|
}
|
|
]
|
|
}
|