This is an automated email from the ASF dual-hosted git repository.
jongyoul pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/zeppelin.git
The following commit(s) were added to refs/heads/master by this push:
new 618036ba70 [MINOR] chore(zeppelin-web-angular): remove @antv/g2plot
and migrate to chart.js to fix npm audit (#5257)
618036ba70 is described below
commit 618036ba70a6524432cb11c9c3219d1161c56134
Author: Jongyoul Lee <[email protected]>
AuthorDate: Fri May 29 12:40:59 2026 +0900
[MINOR] chore(zeppelin-web-angular): remove @antv/g2plot and migrate to
chart.js to fix npm audit (#5257)
---
.../projects/zeppelin-react/package-lock.json | 398 ++-------------------
.../projects/zeppelin-react/package.json | 2 +-
.../visualizations/TableVisualization.tsx | 147 +++++---
3 files changed, 126 insertions(+), 421 deletions(-)
diff --git a/zeppelin-web-angular/projects/zeppelin-react/package-lock.json
b/zeppelin-web-angular/projects/zeppelin-react/package-lock.json
index 422ac91ed5..598ac2b7bb 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 537ea10cd3..7621820ada 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 4b34591c23..bec6bc8673 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]);
