@ebuilding/chart 2.1.7 → 2.1.9

package/fesm2022/echart.gauge.mjs

@@ -0,0 +1,161 @@
+import * as i0 from '@angular/core';
+import { Component, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as echarts from 'echarts/core';
+import { GaugeChart } from 'echarts/charts';
+import { TitleComponent, TooltipComponent, GridComponent, LegendComponent } from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
+import { GramBaseChartService } from '@ebuilding/chart/service';
+
+/**
+ * gauge
+ */
+echarts.use([GaugeChart, TitleComponent, TooltipComponent, GridComponent, LegendComponent, CanvasRenderer]);
+class EchartGaugeMainComponent extends GramBaseChartService {
+    color = [
+        '#71D1FF',
+        '#71A9FF',
+        '#8C94FC',
+        '#DDB0F0',
+        '#FFCA5E',
+        '#FFB15E',
+        '#71D1FF',
+        '#71A9FF',
+        '#8C94FC',
+        '#DDB0F0',
+        '#FFCA5E',
+        '#FFB15E',
+    ];
+    constructor() {
+        super();
+    }
+    ngOnInit() { }
+    initChartData() {
+        if (this.config && this.config?.data && this.config?.data?.val && Array.isArray(this.config.data.val) && this.config.data.val.length > 0) {
+            let item = this.config.data.val[0];
+            if (item && item?.data && item?.data?.length > 0) {
+                this.chartData = [
+                    {
+                        value: item?.data[0],
+                        name: null
+                    }
+                ];
+            }
+        }
+    }
+    /**
+     * 初始化图表配置
+     */
+    initChartOption() {
+        this.chartOption = {
+            tooltip: {
+                formatter: '{a} <br/>{b} : {c}%'
+            },
+            series: [
+                {
+                    type: 'gauge',
+                    startAngle: 180,
+                    endAngle: 0,
+                    center: ['50%', '50%'], // ★★ 下移半圆，让文字靠近环
+                    radius: '90%', // ★★ 调整半圆大小
+                    progress: {
+                        show: true,
+                        width: 5
+                    },
+                    axisLine: {
+                        lineStyle: {
+                            width: 5
+                        }
+                    },
+                    axisTick: {
+                        show: false
+                    },
+                    splitLine: {
+                        length: 5,
+                        lineStyle: {
+                            width: 3,
+                            color: '#999'
+                        }
+                    },
+                    axisLabel: {
+                        distance: 8,
+                        color: '#999',
+                        fontSize: 10
+                    },
+                    anchor: {
+                        show: true,
+                        showAbove: true,
+                        size: 10,
+                        itemStyle: {
+                            borderWidth: 2
+                        }
+                    },
+                    title: {
+                        show: false
+                    },
+                    detail: {
+                        valueAnimation: true,
+                        fontSize: 14,
+                        offsetCenter: [0, '18%']
+                    },
+                    data: this.chartData
+                }
+            ]
+        };
+    }
+    /**
+     * 初始化图表数据
+     */
+    loadChartInfo() {
+        if (this.config) {
+            this.initChartData();
+            this.initChartLegend();
+            this.initChartTitle();
+            this.initChartOption();
+            setTimeout(() => {
+                this.renderChart();
+            }, 0);
+        }
+    }
+    /**
+     * 渲染图表
+     */
+    renderChart() {
+        if (!this.chartInstance) {
+            this.chartInstance = echarts.init(this.chartContainer.nativeElement);
+            this.chartInstance.setOption(this.chartOption);
+            window.addEventListener('resize', () => {
+                this.chartInstance?.resize();
+            });
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeMainComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: EchartGaugeMainComponent, isStandalone: true, selector: "echart-gauge", usesInheritance: true, ngImport: i0, template: "<div #chartContainer id=\"chartContainer\" style=\"width: 100%; height: 100%;\"></div>", styles: [":host ::ng-deep{display:flex;flex:1;flex-direction:column;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeMainComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'echart-gauge', imports: [
+                        CommonModule
+                    ], template: "<div #chartContainer id=\"chartContainer\" style=\"width: 100%; height: 100%;\"></div>", styles: [":host ::ng-deep{display:flex;flex:1;flex-direction:column;width:100%;height:100%}\n"] }]
+        }], ctorParameters: () => [] });
+
+const components = [EchartGaugeMainComponent];
+class EchartGaugeModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeModule, imports: [EchartGaugeMainComponent], exports: [EchartGaugeMainComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeModule, imports: [components] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: EchartGaugeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...components],
+                    exports: [...components],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { EchartGaugeMainComponent, EchartGaugeModule };
+//# sourceMappingURL=echart.gauge.mjs.map

package/fesm2022/echart.gauge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"echart.gauge.mjs","sources":["../../../../packages/chart/echart/gauge/src/default/index.ts","../../../../packages/chart/echart/gauge/src/default/index.html","../../../../packages/chart/echart/gauge/src/index.module.ts","../../../../packages/chart/echart/gauge/echart.gauge.ts"],"sourcesContent":["/**\n * gauge\n */\nimport { Component, OnInit } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport * as echarts from 'echarts/core';\nimport { GaugeChart } from 'echarts/charts';\nimport { TitleComponent, TooltipComponent, GridComponent, LegendComponent } from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { GramBaseChartService } from '@ebuilding/chart/service';\nimport _ from 'lodash';\necharts.use([GaugeChart, TitleComponent, TooltipComponent, GridComponent, LegendComponent, CanvasRenderer]);\n\n@Component({\n  selector: 'echart-gauge',\n  templateUrl: './index.html',\n  styleUrls: ['./index.less'],\n  imports: [\n    CommonModule\n  ]\n})\nexport class EchartGaugeMainComponent extends GramBaseChartService implements OnInit {\n  override color = [\n    '#71D1FF',\n    '#71A9FF',\n    '#8C94FC',\n    '#DDB0F0',\n    '#FFCA5E',\n    '#FFB15E',\n    '#71D1FF',\n    '#71A9FF',\n    '#8C94FC',\n    '#DDB0F0',\n    '#FFCA5E',\n    '#FFB15E',\n  ];\n\n  constructor() {\n    super();\n  }\n\n  ngOnInit(): void { }\n\n  initChartData() {\n    if (this.config && this.config?.data && this.config?.data?.val && Array.isArray(this.config.data.val) && this.config.data.val.length > 0) {\n      let item: any = this.config.data.val[0];\n      if (item && item?.data && item?.data?.length > 0) {\n        this.chartData = [\n          {\n            value: item?.data[0],\n            name: null\n          }\n        ];\n      }\n    }\n  }\n\n  /**\n   * 初始化图表配置\n   */\n  initChartOption() {\n\n    this.chartOption = {\n      tooltip: {\n        formatter: '{a} <br/>{b} : {c}%'\n      },\n      series: [\n        {\n          type: 'gauge',\n          startAngle: 180,\n          endAngle: 0,\n          center: ['50%', '50%'],    // ★★ 下移半圆，让文字靠近环\n          radius: '90%',             // ★★ 调整半圆大小\n          progress: {\n            show: true,\n            width: 5\n          },\n          axisLine: {\n            lineStyle: {\n              width: 5\n            }\n          },\n          axisTick: {\n            show: false\n          },\n          splitLine: {\n            length: 5,\n            lineStyle: {\n              width: 3,\n              color: '#999'\n            }\n          },\n          axisLabel: {\n            distance: 8,\n            color: '#999',\n            fontSize: 10\n          },\n          anchor: {\n            show: true,\n            showAbove: true,\n            size: 10,\n            itemStyle: {\n              borderWidth: 2\n            }\n          },\n          title: {\n            show: false\n          },\n          detail: {\n            valueAnimation: true,\n            fontSize: 14,\n            offsetCenter: [0, '18%']\n          },\n          data: this.chartData\n        }\n      ]\n    };\n  }\n\n  /**\n   * 初始化图表数据\n   */\n  override loadChartInfo() {\n    if (this.config) {\n      this.initChartData();\n      this.initChartLegend();\n      this.initChartTitle();\n      this.initChartOption();\n      setTimeout(() => {\n        this.renderChart();\n      }, 0);\n    }\n  }\n\n  /**\n   * 渲染图表\n   */\n  renderChart() {\n    if (!this.chartInstance) {\n      this.chartInstance = echarts.init(this.chartContainer.nativeElement);\n      this.chartInstance.setOption(this.chartOption);\n      window.addEventListener('resize', () => {\n        this.chartInstance?.resize();\n      });\n    }\n  }\n}\n","<div #chartContainer id=\"chartContainer\" style=\"width: 100%; height: 100%;\"></div>","import { NgModule } from '@angular/core';\nimport { EchartGaugeMainComponent } from './default/index';\nconst components: any[] = [EchartGaugeMainComponent];\n\n@NgModule({\n  imports: [...components],\n  exports: [...components],\n})\nexport class EchartGaugeModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebuilding/chart",
-  "version": "2.1.7",
+  "version": "2.1.9",
   "dependencies": {
     "extend": "undefined",
     "tslib": "^2.3.0"
@@ -19,25 +19,29 @@
       "types": "./echart/index.d.ts",
       "default": "./fesm2022/chart.echart.mjs"
     },
-    "./service": {
-      "types": "./service/index.d.ts",
-      "default": "./fesm2022/srv.base.mjs"
-    },
     "./report": {
       "types": "./report/index.d.ts",
       "default": "./fesm2022/chart.report.mjs"
     },
+    "./service": {
+      "types": "./service/index.d.ts",
+      "default": "./fesm2022/srv.base.mjs"
+    },
     "./echart/bar": {
       "types": "./echart/bar/index.d.ts",
       "default": "./fesm2022/echart.bar.mjs"
     },
+    "./echart/category-stack": {
+      "types": "./echart/category-stack/index.d.ts",
+      "default": "./fesm2022/echart.category-stack.mjs"
+    },
     "./echart/bar2": {
       "types": "./echart/bar2/index.d.ts",
       "default": "./fesm2022/echart.bar2.mjs"
     },
-    "./echart/category-stack": {
-      "types": "./echart/category-stack/index.d.ts",
-      "default": "./fesm2022/echart.bar.mjs"
+    "./echart/indicator": {
+      "types": "./echart/indicator/index.d.ts",
+      "default": "./fesm2022/echart.indicator.mjs"
     },
     "./echart/content": {
       "types": "./echart/content/index.d.ts",
@@ -45,20 +49,16 @@
     },
     "./echart/gauge": {
       "types": "./echart/gauge/index.d.ts",
-      "default": "./fesm2022/echart.bar.mjs"
+      "default": "./fesm2022/echart.gauge.mjs"
     },
-    "./echart/indicator": {
-      "types": "./echart/indicator/index.d.ts",
-      "default": "./fesm2022/echart.indicator.mjs"
+    "./echart/line": {
+      "types": "./echart/line/index.d.ts",
+      "default": "./fesm2022/echart.line.mjs"
     },
     "./echart/number": {
       "types": "./echart/number/index.d.ts",
       "default": "./fesm2022/echart.number.mjs"
     },
-    "./echart/line": {
-      "types": "./echart/line/index.d.ts",
-      "default": "./fesm2022/echart.line.mjs"
-    },
     "./echart/pie": {
       "types": "./echart/pie/index.d.ts",
       "default": "./fesm2022/echart.pie.mjs"