diff --git a/zeppelin-web-angular/projects/zeppelin-react/package-lock.json b/zeppelin-web-angular/projects/zeppelin-react/package-lock.json index 422ac91ed5c..598ac2b7bb6 100644 --- a/zeppelin-web-angular/projects/zeppelin-react/package-lock.json +++ b/zeppelin-web-angular/projects/zeppelin-react/package-lock.json @@ -9,10 +9,10 @@ "version": "0.0.1", "dependencies": { "@ant-design/icons": "5.4.0", - "@antv/g2plot": "2.3.32", "@zeppelin/sdk": "file:../zeppelin-sdk", "ansi-to-react": "6.2.6", "antd": "5.21.0", + "chart.js": "^4.5.1", "file-saver": "2.0.5", "react": "18.3.1", "react-dom": "18.3.1", @@ -146,302 +146,6 @@ "react": ">=16.9.0" } }, - "node_modules/@antv/adjust": { - "version": "0.2.5", - "resolved": "https://registry.npmjs.org/@antv/adjust/-/adjust-0.2.5.tgz", - "integrity": "sha512-MfWZOkD9CqXRES6MBGRNe27Q577a72EIwyMnE29wIlPliFvJfWwsrONddpGU7lilMpVKecS3WAzOoip3RfPTRQ==", - "license": "MIT", - "dependencies": { - "@antv/util": "~2.0.0", - "tslib": "^1.10.0" - } - }, - "node_modules/@antv/adjust/node_modules/tslib": { - "version": "1.14.1", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", - "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==", - "license": "0BSD" - }, - "node_modules/@antv/attr": { - "version": "0.3.5", - "resolved": "https://registry.npmjs.org/@antv/attr/-/attr-0.3.5.tgz", - "integrity": "sha512-wuj2gUo6C8Q2ASSMrVBuTcb5LcV+Tc0Egiy6bC42D0vxcQ+ta13CLxgMmHz8mjD0FxTPJDXSciyszRSC5TdLsg==", - "license": "MIT", - "dependencies": { - "@antv/color-util": "^2.0.1", - "@antv/scale": "^0.3.0", - "@antv/util": "~2.0.0", - "tslib": "^2.3.1" - } - }, - "node_modules/@antv/color-util": { - "version": "2.0.6", - "resolved": "https://registry.npmjs.org/@antv/color-util/-/color-util-2.0.6.tgz", - "integrity": "sha512-KnPEaAH+XNJMjax9U35W67nzPI+QQ2x27pYlzmSIWrbj4/k8PGrARXfzDTjwoozHJY8qG62Z+Ww6Alhu2FctXQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/component": { - "version": "0.8.35", - "resolved": "https://registry.npmjs.org/@antv/component/-/component-0.8.35.tgz", - "integrity": "sha512-VnRa5X77nBPI952o2xePEEMSNZ6g2mcUDrQY8mVL2kino/8TFhqDq5fTRmDXZyWyIYd4ulJTz5zgeSwAnX/INQ==", - "license": "MIT", - "dependencies": { - "@antv/color-util": "^2.0.3", - "@antv/dom-util": "~2.0.1", - "@antv/g-base": "^0.5.9", - "@antv/matrix-util": "^3.1.0-beta.1", - "@antv/path-util": "~2.0.7", - "@antv/scale": "~0.3.1", - "@antv/util": "~2.0.0", - "fecha": "~4.2.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/component/node_modules/@antv/path-util": { - "version": "2.0.15", - "resolved": "https://registry.npmjs.org/@antv/path-util/-/path-util-2.0.15.tgz", - "integrity": "sha512-R2VLZ5C8PLPtr3VciNyxtjKqJ0XlANzpFb5sE9GE61UQqSRuSVSzIakMxjEPrpqbgc+s+y8i+fmc89Snu7qbNw==", - "license": "ISC", - "dependencies": { - "@antv/matrix-util": "^3.0.4", - "@antv/util": "^2.0.9", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/component/node_modules/@antv/path-util/node_modules/@antv/matrix-util": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/@antv/matrix-util/-/matrix-util-3.0.4.tgz", - "integrity": "sha512-BAPyu6dUliHcQ7fm9hZSGKqkwcjEDVLVAstlHULLvcMZvANHeLXgHEgV7JqcAV/GIhIz8aZChIlzM1ZboiXpYQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "gl-matrix": "^3.3.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/coord": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/@antv/coord/-/coord-0.3.1.tgz", - "integrity": "sha512-rFE94C8Xzbx4xmZnHh2AnlB3Qm1n5x0VT3OROy257IH6Rm4cuzv1+tZaUBATviwZd99S+rOY9telw/+6C9GbRw==", - "license": "MIT", - "dependencies": { - "@antv/matrix-util": "^3.1.0-beta.2", - "@antv/util": "~2.0.12", - "tslib": "^2.1.0" - } - }, - "node_modules/@antv/dom-util": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/@antv/dom-util/-/dom-util-2.0.4.tgz", - "integrity": "sha512-2shXUl504fKwt82T3GkuT4Uoc6p9qjCKnJ8gXGLSW4T1W37dqf9AV28aCfoVPHp2BUXpSsB+PAJX2rG/jLHsLQ==", - "license": "MIT", - "dependencies": { - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/event-emitter": { - "version": "0.1.3", - "resolved": "https://registry.npmjs.org/@antv/event-emitter/-/event-emitter-0.1.3.tgz", - "integrity": "sha512-4ddpsiHN9Pd4UIlWuKVK1C4IiZIdbwQvy9i7DUSI3xNJ89FPUFt8lxDYj8GzzfdllV0NkJTRxnG+FvLk0llidg==", - "license": "MIT" - }, - "node_modules/@antv/g-base": { - "version": "0.5.16", - "resolved": "https://registry.npmjs.org/@antv/g-base/-/g-base-0.5.16.tgz", - "integrity": "sha512-jP06wggTubDPHXoKwFg3/f1lyxBX9ywwN3E/HG74Nd7DXqOXQis8tsIWW+O6dS/h9vyuXLd1/wDWkMMm3ZzXdg==", - "license": "ISC", - "dependencies": { - "@antv/event-emitter": "^0.1.1", - "@antv/g-math": "^0.1.9", - "@antv/matrix-util": "^3.1.0-beta.1", - "@antv/path-util": "~2.0.5", - "@antv/util": "~2.0.13", - "@types/d3-timer": "^2.0.0", - "d3-ease": "^1.0.5", - "d3-interpolate": "^3.0.1", - "d3-timer": "^1.0.9", - "detect-browser": "^5.1.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-base/node_modules/@antv/path-util": { - "version": "2.0.15", - "resolved": "https://registry.npmjs.org/@antv/path-util/-/path-util-2.0.15.tgz", - "integrity": "sha512-R2VLZ5C8PLPtr3VciNyxtjKqJ0XlANzpFb5sE9GE61UQqSRuSVSzIakMxjEPrpqbgc+s+y8i+fmc89Snu7qbNw==", - "license": "ISC", - "dependencies": { - "@antv/matrix-util": "^3.0.4", - "@antv/util": "^2.0.9", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-base/node_modules/@antv/path-util/node_modules/@antv/matrix-util": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/@antv/matrix-util/-/matrix-util-3.0.4.tgz", - "integrity": "sha512-BAPyu6dUliHcQ7fm9hZSGKqkwcjEDVLVAstlHULLvcMZvANHeLXgHEgV7JqcAV/GIhIz8aZChIlzM1ZboiXpYQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "gl-matrix": "^3.3.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-canvas": { - "version": "0.5.17", - "resolved": "https://registry.npmjs.org/@antv/g-canvas/-/g-canvas-0.5.17.tgz", - "integrity": "sha512-sXYJMWTOlb/Ycb6sTKu00LcJqInXJY4t99+kSM40u2OfqrXYmaXDjHR7D2V0roMkbK/QWiWS9UnEidCR1VtMOA==", - "license": "ISC", - "dependencies": { - "@antv/g-base": "^0.5.12", - "@antv/g-math": "^0.1.9", - "@antv/matrix-util": "^3.1.0-beta.1", - "@antv/path-util": "~2.0.5", - "@antv/util": "~2.0.0", - "gl-matrix": "^3.0.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-canvas/node_modules/@antv/path-util": { - "version": "2.0.15", - "resolved": "https://registry.npmjs.org/@antv/path-util/-/path-util-2.0.15.tgz", - "integrity": "sha512-R2VLZ5C8PLPtr3VciNyxtjKqJ0XlANzpFb5sE9GE61UQqSRuSVSzIakMxjEPrpqbgc+s+y8i+fmc89Snu7qbNw==", - "license": "ISC", - "dependencies": { - "@antv/matrix-util": "^3.0.4", - "@antv/util": "^2.0.9", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-canvas/node_modules/@antv/path-util/node_modules/@antv/matrix-util": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/@antv/matrix-util/-/matrix-util-3.0.4.tgz", - "integrity": "sha512-BAPyu6dUliHcQ7fm9hZSGKqkwcjEDVLVAstlHULLvcMZvANHeLXgHEgV7JqcAV/GIhIz8aZChIlzM1ZboiXpYQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "gl-matrix": "^3.3.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g-math": { - "version": "0.1.9", - "resolved": "https://registry.npmjs.org/@antv/g-math/-/g-math-0.1.9.tgz", - "integrity": "sha512-KHMSfPfZ5XHM1PZnG42Q2gxXfOitYveNTA7L61lR6mhZ8Y/aExsYmHqaKBsSarU0z+6WLrl9C07PQJZaw0uljQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "~2.0.0", - "gl-matrix": "^3.0.0" - } - }, - "node_modules/@antv/g-svg": { - "version": "0.5.7", - "resolved": "https://registry.npmjs.org/@antv/g-svg/-/g-svg-0.5.7.tgz", - "integrity": "sha512-jUbWoPgr4YNsOat2Y/rGAouNQYGpw4R0cvlN0YafwOyacFFYy2zC8RslNd6KkPhhR3XHNSqJOuCYZj/YmLUwYw==", - "license": "ISC", - "dependencies": { - "@antv/g-base": "^0.5.12", - "@antv/g-math": "^0.1.9", - "@antv/util": "~2.0.0", - "detect-browser": "^5.0.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g2": { - "version": "4.2.12", - "resolved": "https://registry.npmjs.org/@antv/g2/-/g2-4.2.12.tgz", - "integrity": "sha512-kTg6ftJol+0hYRM2eMwJKq3JThdq4UAKgCoQalUPjwyF6SSKkWz2QdrIAxfLE7LSTwcIE+L8So1jMaOVVbEi6w==", - "license": "MIT", - "dependencies": { - "@antv/adjust": "^0.2.1", - "@antv/attr": "^0.3.1", - "@antv/color-util": "^2.0.2", - "@antv/component": "^0.8.27", - "@antv/coord": "^0.3.0", - "@antv/dom-util": "^2.0.2", - "@antv/event-emitter": "~0.1.0", - "@antv/g-base": "~0.5.6", - "@antv/g-canvas": "~0.5.10", - "@antv/g-svg": "~0.5.6", - "@antv/matrix-util": "^3.1.0-beta.3", - "@antv/path-util": "^2.0.15", - "@antv/scale": "^0.3.14", - "@antv/util": "~2.0.5", - "tslib": "^2.0.0" - } - }, - "node_modules/@antv/g2/node_modules/@antv/path-util": { - "version": "2.0.15", - "resolved": "https://registry.npmjs.org/@antv/path-util/-/path-util-2.0.15.tgz", - "integrity": "sha512-R2VLZ5C8PLPtr3VciNyxtjKqJ0XlANzpFb5sE9GE61UQqSRuSVSzIakMxjEPrpqbgc+s+y8i+fmc89Snu7qbNw==", - "license": "ISC", - "dependencies": { - "@antv/matrix-util": "^3.0.4", - "@antv/util": "^2.0.9", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g2/node_modules/@antv/path-util/node_modules/@antv/matrix-util": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/@antv/matrix-util/-/matrix-util-3.0.4.tgz", - "integrity": "sha512-BAPyu6dUliHcQ7fm9hZSGKqkwcjEDVLVAstlHULLvcMZvANHeLXgHEgV7JqcAV/GIhIz8aZChIlzM1ZboiXpYQ==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "gl-matrix": "^3.3.0", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/g2plot": { - "version": "2.3.32", - "resolved": "https://registry.npmjs.org/@antv/g2plot/-/g2plot-2.3.32.tgz", - "integrity": "sha512-ksBCEAjd2pki3H3Ce0c26sOD5Z8v6v7hbFwux1se5H5YPpzf+Vq8FgWO8Tokur07wiOqnAJzuEDflxos2KxApw==", - "license": "MIT", - "dependencies": { - "@antv/event-emitter": "^0.1.2", - "@antv/g2": "^4.1.23", - "d3-hierarchy": "^2.0.0", - "d3-regression": "^1.3.5", - "pdfast": "^0.2.0", - "size-sensor": "^1.0.1", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/matrix-util": { - "version": "3.1.0-beta.3", - "resolved": "https://registry.npmjs.org/@antv/matrix-util/-/matrix-util-3.1.0-beta.3.tgz", - "integrity": "sha512-W2R6Za3A6CmG51Y/4jZUM/tFgYSq7vTqJL1VD9dKrvwxS4sE0ZcXINtkp55CdyBwJ6Cwm8pfoRpnD4FnHahN0A==", - "license": "ISC", - "dependencies": { - "@antv/util": "^2.0.9", - "gl-matrix": "^3.4.3", - "tslib": "^2.0.3" - } - }, - "node_modules/@antv/scale": { - "version": "0.3.18", - "resolved": "https://registry.npmjs.org/@antv/scale/-/scale-0.3.18.tgz", - "integrity": "sha512-GHwE6Lo7S/Q5fgaLPaCsW+CH+3zl4aXpnN1skOiEY0Ue9/u+s2EySv6aDXYkAqs//i0uilMDD/0/4n8caX9U9w==", - "license": "MIT", - "dependencies": { - "@antv/util": "~2.0.3", - "fecha": "~4.2.0", - "tslib": "^2.0.0" - } - }, - "node_modules/@antv/util": { - "version": "2.0.17", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", - "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", - "license": "ISC", - "dependencies": { - "csstype": "^3.0.8", - "tslib": "^2.0.3" - } - }, "node_modules/@babel/runtime": { "version": "7.28.4", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz", @@ -1123,6 +827,12 @@ "tslib": "2" } }, + "node_modules/@kurkle/color": { + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz", + "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==", + "license": "MIT" + }, "node_modules/@leichtgewicht/ip-codec": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz", @@ -1530,12 +1240,6 @@ "@types/node": "*" } }, - "node_modules/@types/d3-timer": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/@types/d3-timer/-/d3-timer-2.0.3.tgz", - "integrity": "sha512-jhAJzaanK5LqyLQ50jJNIrB8fjL9gwWZTgYjevPvkDLMU+kTAZkYsobI59nYoeSrH1PucuyJEi247Pb90t6XUg==", - "license": "MIT" - }, "node_modules/@types/eslint": { "version": "9.6.1", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz", @@ -3121,6 +2825,18 @@ "node": ">=0.8" } }, + "node_modules/chart.js": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz", + "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==", + "license": "MIT", + "dependencies": { + "@kurkle/color": "^0.3.0" + }, + "engines": { + "pnpm": ">=8" + } + }, "node_modules/chokidar": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", @@ -3441,51 +3157,6 @@ "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", "license": "MIT" }, - "node_modules/d3-color": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz", - "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==", - "license": "ISC", - "engines": { - "node": ">=12" - } - }, - "node_modules/d3-ease": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-1.0.7.tgz", - "integrity": "sha512-lx14ZPYkhNx0s/2HX5sLFUI3mbasHjSSpwO/KaaNACweVwxUruKyWVcb293wMv1RqTPZyZ8kSZ2NogUZNcLOFQ==", - "license": "BSD-3-Clause" - }, - "node_modules/d3-hierarchy": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-2.0.0.tgz", - "integrity": "sha512-SwIdqM3HxQX2214EG9GTjgmCc/mbSx4mQBn+DuEETubhOw6/U3fmnji4uCVrmzOydMHSO1nZle5gh6HB/wdOzw==", - "license": "BSD-3-Clause" - }, - "node_modules/d3-interpolate": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz", - "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==", - "license": "ISC", - "dependencies": { - "d3-color": "1 - 3" - }, - "engines": { - "node": ">=12" - } - }, - "node_modules/d3-regression": { - "version": "1.3.10", - "resolved": "https://registry.npmjs.org/d3-regression/-/d3-regression-1.3.10.tgz", - "integrity": "sha512-PF8GWEL70cHHWpx2jUQXc68r1pyPHIA+St16muk/XRokETzlegj5LriNKg7o4LR0TySug4nHYPJNNRz/W+/Niw==", - "license": "BSD-3-Clause" - }, - "node_modules/d3-timer": { - "version": "1.0.10", - "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-1.0.10.tgz", - "integrity": "sha512-B1JDm0XDaQC+uvo4DT79H0XmBskgS3l6Ve+1SBCfxgmtIb1AVrPIoqd+nPSv+loMX8szQ0sVUhGngL7D5QPiXw==", - "license": "BSD-3-Clause" - }, "node_modules/data-view-buffer": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz", @@ -3663,12 +3334,6 @@ "npm": "1.2.8000 || >= 1.4.16" } }, - "node_modules/detect-browser": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/detect-browser/-/detect-browser-5.3.0.tgz", - "integrity": "sha512-53rsFbGdwMwlF7qvCt0ypLM5V5/Mbl0szB7GPN8y9NCcbknYOeVVXdrXEq+90IwAfrrzt6Hd+u2E2ntakICU8w==", - "license": "MIT" - }, "node_modules/detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", @@ -4721,12 +4386,6 @@ "node": ">=0.8.0" } }, - "node_modules/fecha": { - "version": "4.2.3", - "resolved": "https://registry.npmjs.org/fecha/-/fecha-4.2.3.tgz", - "integrity": "sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw==", - "license": "MIT" - }, "node_modules/fflate": { "version": "0.3.11", "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.3.11.tgz", @@ -5026,12 +4685,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/gl-matrix": { - "version": "3.4.4", - "resolved": "https://registry.npmjs.org/gl-matrix/-/gl-matrix-3.4.4.tgz", - "integrity": "sha512-latSnyDNt/8zYUB6VIJ6PCh2jBjJX6gnDsoCZ7LyW7GkqrD51EWwa9qCoGixj8YqBtETQK/xY7OmpTF8xz1DdQ==", - "license": "MIT" - }, "node_modules/glob": { "version": "7.2.3", "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", @@ -6978,12 +6631,6 @@ "dev": true, "license": "MIT" }, - "node_modules/pdfast": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/pdfast/-/pdfast-0.2.0.tgz", - "integrity": "sha512-cq6TTu6qKSFUHwEahi68k/kqN2mfepjkGrG9Un70cgdRRKLKY6Rf8P8uvP2NvZktaQZNF3YE7agEkLj0vGK9bA==", - "license": "MIT" - }, "node_modules/picocolors": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", @@ -8790,12 +8437,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/size-sensor": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/size-sensor/-/size-sensor-1.0.2.tgz", - "integrity": "sha512-2NCmWxY7A9pYKGXNBfteo4hy14gWu47rg5692peVMst6lQLPKrVjhY+UTEsPI5ceFRJSl3gVgMYaUi/hKuaiKw==", - "license": "ISC" - }, "node_modules/sockjs": { "version": "0.3.24", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz", @@ -9434,6 +9075,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD" }, "node_modules/tsyringe": { diff --git a/zeppelin-web-angular/projects/zeppelin-react/package.json b/zeppelin-web-angular/projects/zeppelin-react/package.json index 537ea10cd37..7621820adaa 100644 --- a/zeppelin-web-angular/projects/zeppelin-react/package.json +++ b/zeppelin-web-angular/projects/zeppelin-react/package.json @@ -13,10 +13,10 @@ }, "dependencies": { "@ant-design/icons": "5.4.0", - "@antv/g2plot": "2.3.32", "@zeppelin/sdk": "file:../zeppelin-sdk", "ansi-to-react": "6.2.6", "antd": "5.21.0", + "chart.js": "^4.5.1", "file-saver": "2.0.5", "react": "18.3.1", "react-dom": "18.3.1", diff --git a/zeppelin-web-angular/projects/zeppelin-react/src/components/visualizations/TableVisualization.tsx b/zeppelin-web-angular/projects/zeppelin-react/src/components/visualizations/TableVisualization.tsx index 4b34591c23a..bec6bc8673e 100644 --- a/zeppelin-web-angular/projects/zeppelin-react/src/components/visualizations/TableVisualization.tsx +++ b/zeppelin-web-angular/projects/zeppelin-react/src/components/visualizations/TableVisualization.tsx @@ -12,10 +12,10 @@ import { useState, useEffect, useMemo, useRef } from 'react'; import { Table } from 'antd'; -import type { Column, Line, Pie, Scatter } from '@antv/g2plot'; import { VisualizationControls } from './VisualizationControls'; import { parseTableData, exportFile } from '@/utils'; import type { ParagraphConfigResult, ParagraphIResultsMsgItem, VisualizationMode } from '@zeppelin/sdk'; +import type { Chart, ChartConfiguration } from 'chart.js'; interface TableVisualizationProps { result: ParagraphIResultsMsgItem; @@ -66,7 +66,8 @@ export const TableVisualization = ({ result, config }: TableVisualizationProps) }; useEffect(() => { - if (!chartRef.current || !tableData || tableData.rows.length === 0 || currentMode === 'table') return; + const container = chartRef.current; + if (!container || !tableData || tableData.rows.length === 0 || currentMode === 'table') return; const data = tableData.rows.map((row, idx) => ({ category: row[0] || `Row ${idx + 1}`, @@ -75,64 +76,123 @@ export const TableVisualization = ({ result, config }: TableVisualizationProps) y: parseFloat(row[1] || '0') || 0 })); - let chart: Column | Line | Pie | Scatter | null = null; + container.innerHTML = ''; + + let chart: Chart | null = null; let cancelled = false; - import('@antv/g2plot').then(g2plot => { - if (cancelled || !chartRef.current) return; + import('chart.js/auto').then(module => { + if (cancelled || !container) return; + + const ChartConstructor = module.Chart || module.default; + + const canvas = document.createElement('canvas'); + canvas.style.width = '100%'; + canvas.style.height = '100%'; + container.appendChild(canvas); + + const ctx = canvas.getContext('2d'); + if (!ctx) return; + let chartConfig: ChartConfiguration | null = null; switch (currentMode) { case 'multiBarChart': - chart = new g2plot.Column(chartRef.current, { - data, - xField: 'category', - yField: 'value', - color: '#1890ff', - columnWidthRatio: 0.8 - }); + chartConfig = { + type: 'bar', + data: { + labels: data.map(d => d.category), + datasets: [{ + label: 'Value', + data: data.map(d => d.value), + backgroundColor: '#1890ff' + }] + }, + options: { + responsive: true, + maintainAspectRatio: false + } + }; break; case 'lineChart': - chart = new g2plot.Line(chartRef.current, { - data, - xField: 'category', - yField: 'value', - color: '#1890ff' - }); + chartConfig = { + type: 'line', + data: { + labels: data.map(d => d.category), + datasets: [{ + label: 'Value', + data: data.map(d => d.value), + borderColor: '#1890ff', + backgroundColor: 'rgba(24, 144, 255, 0.1)', + tension: 0.1 + }] + }, + options: { + responsive: true, + maintainAspectRatio: false + } + }; break; case 'pieChart': - chart = new g2plot.Pie(chartRef.current, { - data, - angleField: 'value', - colorField: 'category' - }); + chartConfig = { + type: 'pie', + data: { + labels: data.map(d => d.category), + datasets: [{ + data: data.map(d => d.value), + backgroundColor: [ + '#1890ff', '#2fc25b', '#facc14', '#223273', '#8543e0', '#13c2c2', '#3436c7', '#f04864' + ] + }] + }, + options: { + responsive: true, + maintainAspectRatio: false + } + }; break; case 'scatterChart': - chart = new g2plot.Scatter(chartRef.current, { - data, - xField: 'x', - yField: 'y', - color: '#1890ff' - }); + chartConfig = { + type: 'scatter', + data: { + datasets: [{ + label: 'Value', + data: data.map(d => ({ x: d.x, y: d.y })), + backgroundColor: '#1890ff' + }] + }, + options: { + responsive: true, + maintainAspectRatio: false, + scales: { + x: { type: 'linear', position: 'bottom' } + } + } + }; break; case 'stackedAreaChart': - chart = new g2plot.Line(chartRef.current, { - data, - xField: 'category', - yField: 'value', - color: '#1890ff', - point: { - size: 3, - shape: 'circle' + chartConfig = { + type: 'line', + data: { + labels: data.map(d => d.category), + datasets: [{ + label: 'Value', + data: data.map(d => d.value), + borderColor: '#1890ff', + backgroundColor: 'rgba(24, 144, 255, 0.2)', + fill: true, + tension: 0.1 + }] }, - lineStyle: { - lineWidth: 2 + options: { + responsive: true, + maintainAspectRatio: false } - }); + }; break; } - if (chart) { - chart.render(); + if (chartConfig) { + chart = new ChartConstructor(ctx, chartConfig); } }); @@ -141,6 +201,9 @@ export const TableVisualization = ({ result, config }: TableVisualizationProps) if (chart) { chart.destroy(); } + if (container) { + container.innerHTML = ''; + } }; }, [currentMode, tableData]);