{ "order": 2, "key": "area-chart", "type": "area-chart", "name": "面积图", "description": "折线下方填充面积,展示数值随时间的变化趋势并突出总量", "tags": [ "charts", "面积图", "area-chart" ], "renderer": "echarts", "group": "charts", "icon": "solar:graph-new-bold", "usage_notes": [ "默认图表数据仅用于演示,不是真实业务数据", "通过顶层 dataId 关联已有数据源,当前后端尚未实现绑定操作" ], "field_groups": [ "node-base", "chart-title", "chart-legend", "chart-grid", "chart-axis", "chart-line-series", { "key": "area-fill", "label": "面积", "description": "折线下方填充区域", "fields": [ { "path": "props.option.series.0.areaStyle.color", "label": "面积色", "description": "折线下方填充区域的颜色,通常带透明度,例如 rgba(64, 158, 255, 0.25)", "value_type": "color", "aliases": [ "填充色", "面积颜色", "阴影颜色" ] } ] }, "chart-dataset", "chart-encode-xy" ], "event_groups": [ "dom-events", "chart-events" ], "rows_path": "props.option.dataset.source", "data_source": true, "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 }, "title": { "text": "成交额趋势", "top": 8, "left": "center", "textStyle": { "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 }, "yAxis": { "type": "value" }, "series": [ { "name": "成交额", "type": "line", "smooth": true, "symbolSize": 8, "encode": { "x": "date", "y": "revenue" }, "lineStyle": { "width": 3, "color": "#409eff" }, "itemStyle": { "color": "#409eff" }, "areaStyle": { "color": "rgba(64, 158, 255, 0.25)" } } ] } }, "style": null, "events": [] } }