301 lines
7.2 KiB
JSON
301 lines
7.2 KiB
JSON
{
|
|
"order": 7,
|
|
"key": "radar-chart",
|
|
"type": "radar-chart",
|
|
"name": "雷达图",
|
|
"description": "在多个维度上对比一个或多个对象的得分",
|
|
"tags": [
|
|
"charts",
|
|
"雷达图",
|
|
"radar-chart"
|
|
],
|
|
"renderer": "echarts",
|
|
"group": "charts",
|
|
"icon": "solar:radar-2-bold",
|
|
"sample_data": true,
|
|
"usage_notes": [
|
|
"默认图表数据仅用于演示，不是真实业务数据",
|
|
"通过顶层 dataId 关联已有数据源，当前后端尚未实现绑定操作"
|
|
],
|
|
"field_groups": [
|
|
"node-base",
|
|
"chart-title",
|
|
"chart-legend",
|
|
"chart-palette",
|
|
{
|
|
"key": "radar-series",
|
|
"label": "线条",
|
|
"description": "各对象雷达线的颜色和填充",
|
|
"fields": [
|
|
{
|
|
"path": "props.option.color.0",
|
|
"label": "第一条线颜色",
|
|
"description": "第一个对象（数据集第一行）的雷达线颜色",
|
|
"value_type": "color",
|
|
"aliases": [
|
|
"颜色",
|
|
"主色"
|
|
]
|
|
},
|
|
{
|
|
"path": "props.option.color.1",
|
|
"label": "第二条线颜色",
|
|
"description": "第二个对象（数据集第二行）的雷达线颜色",
|
|
"value_type": "color"
|
|
},
|
|
{
|
|
"path": "props.option.series.0.lineStyle.width",
|
|
"label": "线宽",
|
|
"description": "雷达线的粗细",
|
|
"value_type": "number",
|
|
"minimum": 1,
|
|
"maximum": 12,
|
|
"unit": "px",
|
|
"aliases": [
|
|
"线条粗细"
|
|
],
|
|
"panel": false
|
|
},
|
|
{
|
|
"path": "props.option.series.0.areaStyle.opacity",
|
|
"label": "填充透明度",
|
|
"description": "雷达线围成区域的填充透明度，0 为不填充，1 为不透明",
|
|
"value_type": "number",
|
|
"minimum": 0,
|
|
"maximum": 1,
|
|
"aliases": [
|
|
"填充",
|
|
"透明度"
|
|
],
|
|
"panel": false
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"key": "radar-axis",
|
|
"label": "维度",
|
|
"description": "雷达图的各个维度及其文字样式",
|
|
"fields": [
|
|
{
|
|
"path": "props.option.radar.indicator",
|
|
"label": "维度",
|
|
"description": "雷达图的维度列表，每项为 {name: 维度名称, max: 满分}，顺序与数值字段一一对应",
|
|
"value_type": "array",
|
|
"item_type": "object",
|
|
"aliases": [
|
|
"指标",
|
|
"维度名称",
|
|
"满分"
|
|
],
|
|
"panel": false
|
|
},
|
|
{
|
|
"path": "props.option.radar.axisName.color",
|
|
"label": "维度文字色",
|
|
"description": "维度名称文字的颜色",
|
|
"value_type": "color",
|
|
"aliases": [
|
|
"维度颜色",
|
|
"指标文字颜色"
|
|
],
|
|
"panel": false,
|
|
"themed": true
|
|
},
|
|
{
|
|
"path": "props.option.radar.axisName.fontSize",
|
|
"label": "维度字号",
|
|
"description": "维度名称文字的大小",
|
|
"value_type": "number",
|
|
"minimum": 8,
|
|
"maximum": 48,
|
|
"unit": "px",
|
|
"default": 12,
|
|
"aliases": [
|
|
"维度大小",
|
|
"指标文字大小"
|
|
],
|
|
"panel": false
|
|
}
|
|
]
|
|
},
|
|
"chart-dataset",
|
|
{
|
|
"key": "radar-data",
|
|
"label": "数据映射",
|
|
"description": "雷达图从数据集（dataset.source）中取哪些列",
|
|
"fields": [
|
|
{
|
|
"path": "props.option.series.0.encode.itemName",
|
|
"label": "名称字段",
|
|
"description": "每个对象（每条雷达线）的名称使用数据集中的哪一列",
|
|
"value_type": "string",
|
|
"aliases": [
|
|
"对象字段",
|
|
"类目字段"
|
|
]
|
|
},
|
|
{
|
|
"path": "props.option.series.0.encode.value",
|
|
"label": "数值字段",
|
|
"description": "各维度的得分依次使用数据集中的哪些列，顺序与维度列表一一对应",
|
|
"value_type": "array",
|
|
"item_type": "string",
|
|
"aliases": [
|
|
"维度字段",
|
|
"得分字段"
|
|
],
|
|
"panel": false
|
|
}
|
|
]
|
|
}
|
|
],
|
|
"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"
|
|
}
|
|
],
|
|
"schema": {
|
|
"type": "radar-chart",
|
|
"name": "雷达图",
|
|
"layout": {
|
|
"x": 0,
|
|
"y": 0,
|
|
"width": 400,
|
|
"height": 280
|
|
},
|
|
"props": {
|
|
"option": {
|
|
"color": [
|
|
"#409eff",
|
|
"#67c23a",
|
|
"#e6a23c",
|
|
"#f56c6c",
|
|
"#909399"
|
|
],
|
|
"legend": {
|
|
"top": 38,
|
|
"left": "center",
|
|
"itemWidth": 12,
|
|
"itemHeight": 8,
|
|
"show": true
|
|
},
|
|
"title": {
|
|
"text": "店铺服务评分",
|
|
"top": 8,
|
|
"left": "center",
|
|
"textStyle": {
|
|
"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
|
|
}
|
|
]
|
|
},
|
|
"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
|
|
},
|
|
"areaStyle": {
|
|
"opacity": 0.18
|
|
}
|
|
}
|
|
]
|
|
}
|
|
},
|
|
"style": null,
|
|
"events": []
|
|
}
|
|
}
|