Move Curve to uPlot (#336)
This commit is contained in:
parent
f94eded413
commit
bbce244f75
|
@ -23,7 +23,6 @@
|
|||
"react-router-dom": "^5.2.1",
|
||||
"react-scripts": "^4.0.3",
|
||||
"react-table-drag-select": "^0.3.1",
|
||||
"recharts": "^2.1.8",
|
||||
"uplot": "^1.6.18",
|
||||
"uplot-react": "^1.1.1"
|
||||
},
|
||||
|
@ -3844,11 +3843,6 @@
|
|||
"@types/react-router": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/resize-observer-browser": {
|
||||
"version": "0.1.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/resize-observer-browser/-/resize-observer-browser-0.1.6.tgz",
|
||||
"integrity": "sha512-61IfTac0s9jvNtBCpyo86QeaN8qqpMGHdK0uGKCCIy2dt5/Yk84VduHIdWAcmkC5QvdkPL0p5eWYgUZtHKKUVg=="
|
||||
},
|
||||
"node_modules/@types/resolve": {
|
||||
"version": "0.0.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
|
||||
|
@ -6816,11 +6810,6 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/css-unit-converter": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/css-unit-converter/-/css-unit-converter-1.1.2.tgz",
|
||||
"integrity": "sha512-IiJwMC8rdZE0+xiEZHeru6YoONC4rfPMqGm2W85jMIbkFvv5nFTwJVFHam2eFrN6txmoUYFAFXiv8ICVeTO0MA=="
|
||||
},
|
||||
"node_modules/css-what": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/css-what/-/css-what-5.1.0.tgz",
|
||||
|
@ -7131,11 +7120,6 @@
|
|||
"resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.3.1.tgz",
|
||||
"integrity": "sha512-V0pfhfr8suzyPGOx3nmq4aHqabehUZn6Ch9kyFpV79TGDTWFmHqUqXdabR7QHqxzrYolF4+tVmJhUG4OURg5dQ=="
|
||||
},
|
||||
"node_modules/decimal.js-light": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
|
||||
"integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg=="
|
||||
},
|
||||
"node_modules/decode-uri-component": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
|
||||
|
@ -7552,14 +7536,6 @@
|
|||
"utila": "~0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-helpers": {
|
||||
"version": "3.4.0",
|
||||
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
|
||||
"integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.1.2"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
|
@ -9235,11 +9211,6 @@
|
|||
"integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fast-equals": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-2.0.4.tgz",
|
||||
"integrity": "sha512-caj/ZmjHljPrZtbzJ3kfH5ia/k4mTJe/qSiXAGzxZWRZgsgDV0cvNaQULqUX8t0/JVlzzEdYOwCN5DmzTxoD4w=="
|
||||
},
|
||||
"node_modules/fast-glob": {
|
||||
"version": "3.2.7",
|
||||
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.7.tgz",
|
||||
|
@ -13612,11 +13583,6 @@
|
|||
"lodash._reinterpolate": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/lodash.throttle": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
|
||||
"integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
|
||||
},
|
||||
"node_modules/lodash.truncate": {
|
||||
"version": "4.4.2",
|
||||
"resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
|
||||
|
@ -17530,11 +17496,6 @@
|
|||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
},
|
||||
"node_modules/react-lifecycles-compat": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
|
||||
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
|
||||
},
|
||||
"node_modules/react-perfect-scrollbar": {
|
||||
"version": "1.5.8",
|
||||
"resolved": "https://registry.npmjs.org/react-perfect-scrollbar/-/react-perfect-scrollbar-1.5.8.tgz",
|
||||
|
@ -17585,21 +17546,6 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-resize-detector": {
|
||||
"version": "6.7.6",
|
||||
"resolved": "https://registry.npmjs.org/react-resize-detector/-/react-resize-detector-6.7.6.tgz",
|
||||
"integrity": "sha512-/6RZlul1yePSoYJxWxmmgjO320moeLC/khrwpEVIL+D2EjLKhqOwzFv+H8laMbImVj7Zu4FlMa0oA7au3/ChjQ==",
|
||||
"dependencies": {
|
||||
"@types/resize-observer-browser": "^0.1.6",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"lodash.throttle": "^4.1.1",
|
||||
"resize-observer-polyfill": "^1.5.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.0.0 || ^17.0.0",
|
||||
"react-dom": "^16.0.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.1.tgz",
|
||||
|
@ -17794,21 +17740,6 @@
|
|||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/react-smooth": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-2.0.0.tgz",
|
||||
"integrity": "sha512-wK4dBBR6P21otowgMT9toZk+GngMplGS1O5gk+2WSiHEXIrQgDvhR5IIlT74Vtu//qpTcipkgo21dD7a7AUNxw==",
|
||||
"dependencies": {
|
||||
"fast-equals": "^2.0.0",
|
||||
"raf": "^3.4.0",
|
||||
"react-transition-group": "2.9.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"prop-types": "^15.6.0",
|
||||
"react": "^15.0.0 || ^16.0.0 || ^17.0.0",
|
||||
"react-dom": "^15.0.0 || ^16.0.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-table-drag-select": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-table-drag-select/-/react-table-drag-select-0.3.1.tgz",
|
||||
|
@ -17834,21 +17765,6 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-transition-group": {
|
||||
"version": "2.9.0",
|
||||
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
|
||||
"integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
|
||||
"dependencies": {
|
||||
"dom-helpers": "^3.4.0",
|
||||
"loose-envify": "^1.4.0",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-lifecycles-compat": "^3.0.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=15.0.0",
|
||||
"react-dom": ">=15.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/read-pkg": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
|
||||
|
@ -17993,153 +17909,6 @@
|
|||
"node": ">=8.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts": {
|
||||
"version": "2.1.8",
|
||||
"resolved": "https://registry.npmjs.org/recharts/-/recharts-2.1.8.tgz",
|
||||
"integrity": "sha512-Wi7ufdDGyvy/BPf1za1Ok7VeWB2KtEejaewO9ulmlUhvn5l5RPS4AOkrUfhtMRTTjgJ4K6AbWMDpwtDjczUHJA==",
|
||||
"dependencies": {
|
||||
"@types/d3-interpolate": "^2.0.0",
|
||||
"@types/d3-scale": "^3.0.0",
|
||||
"@types/d3-shape": "^2.0.0",
|
||||
"classnames": "^2.2.5",
|
||||
"d3-interpolate": "^2.0.0",
|
||||
"d3-scale": "^3.0.0",
|
||||
"d3-shape": "^2.0.0",
|
||||
"eventemitter3": "^4.0.1",
|
||||
"lodash": "^4.17.19",
|
||||
"react-is": "^16.10.2",
|
||||
"react-resize-detector": "^6.6.3",
|
||||
"react-smooth": "^2.0.0",
|
||||
"recharts-scale": "^0.4.4",
|
||||
"reduce-css-calc": "^2.1.8"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.0.0 || ^17.0.0",
|
||||
"react-dom": "^16.0.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts-scale": {
|
||||
"version": "0.4.5",
|
||||
"resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz",
|
||||
"integrity": "sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==",
|
||||
"dependencies": {
|
||||
"decimal.js-light": "^2.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-color": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-2.0.3.tgz",
|
||||
"integrity": "sha512-+0EtEjBfKEDtH9Rk3u3kLOUXM5F+iZK+WvASPb0MhIZl8J8NUvGeZRwKCXl+P3HkYx5TdU4YtcibpqHkSR9n7w=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-interpolate": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-2.0.2.tgz",
|
||||
"integrity": "sha512-lElyqlUfIPyWG/cD475vl6msPL4aMU7eJvx1//Q177L8mdXoVPFl1djIESF2FKnc0NyaHvQlJpWwKJYwAhUoCw==",
|
||||
"dependencies": {
|
||||
"@types/d3-color": "^2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-path": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-2.0.1.tgz",
|
||||
"integrity": "sha512-6K8LaFlztlhZO7mwsZg7ClRsdLg3FJRzIIi6SZXDWmmSJc2x8dd2VkESbLXdk3p8cuvz71f36S0y8Zv2AxqvQw=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-scale": {
|
||||
"version": "3.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-3.3.2.tgz",
|
||||
"integrity": "sha512-gGqr7x1ost9px3FvIfUMi5XA/F/yAf4UkUDtdQhpH92XCT0Oa7zkkRzY61gPVJq+DxpHn/btouw5ohWkbBsCzQ==",
|
||||
"dependencies": {
|
||||
"@types/d3-time": "^2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-shape": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-2.1.3.tgz",
|
||||
"integrity": "sha512-HAhCel3wP93kh4/rq+7atLdybcESZ5bRHDEZUojClyZWsRuEMo3A52NGYJSh48SxfxEU6RZIVbZL2YFZ2OAlzQ==",
|
||||
"dependencies": {
|
||||
"@types/d3-path": "^2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/@types/d3-time": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-2.1.1.tgz",
|
||||
"integrity": "sha512-9MVYlmIgmRR31C5b4FVSWtuMmBHh2mOWQYfl7XAYOa8dsnb7iEmUmRSWSFgXFtkjxO65d7hTUHQC+RhR/9IWFg=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-array": {
|
||||
"version": "2.12.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.12.1.tgz",
|
||||
"integrity": "sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==",
|
||||
"dependencies": {
|
||||
"internmap": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-color": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
|
||||
"integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-format": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
|
||||
"integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-interpolate": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
|
||||
"integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
|
||||
"dependencies": {
|
||||
"d3-color": "1 - 2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-path": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-path/-/d3-path-2.0.0.tgz",
|
||||
"integrity": "sha512-ZwZQxKhBnv9yHaiWd6ZU4x5BtCQ7pXszEV9CU6kRgwIQVQGLMv1oiL4M+MK/n79sYzsj+gcgpPQSctJUsLN7fA=="
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-scale": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.3.0.tgz",
|
||||
"integrity": "sha512-1JGp44NQCt5d1g+Yy+GeOnZP7xHo0ii8zsQp6PGzd+C1/dl0KGsp9A7Mxwp+1D1o4unbTTxVdU/ZOIEBoeZPbQ==",
|
||||
"dependencies": {
|
||||
"d3-array": "^2.3.0",
|
||||
"d3-format": "1 - 2",
|
||||
"d3-interpolate": "1.2.0 - 2",
|
||||
"d3-time": "^2.1.1",
|
||||
"d3-time-format": "2 - 3"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-shape": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-2.1.0.tgz",
|
||||
"integrity": "sha512-PnjUqfM2PpskbSLTJvAzp2Wv4CZsnAgTfcVRTwW03QR3MkXF8Uo7B1y/lWkAsmbKwuecto++4NlsYcvYpXpTHA==",
|
||||
"dependencies": {
|
||||
"d3-path": "1 - 2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-time": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.1.1.tgz",
|
||||
"integrity": "sha512-/eIQe/eR4kCQwq7yxi7z4c6qEXf2IYGcjoWB5OOQy4Tq9Uv39/947qlDcN2TLkiTzQWzvnsuYPB9TrWaNfipKQ==",
|
||||
"dependencies": {
|
||||
"d3-array": "2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/d3-time-format": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
|
||||
"integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
|
||||
"dependencies": {
|
||||
"d3-time": "1 - 2"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/internmap": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.1.tgz",
|
||||
"integrity": "sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw=="
|
||||
},
|
||||
"node_modules/recursive-readdir": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.2.tgz",
|
||||
|
@ -18151,20 +17920,6 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/reduce-css-calc": {
|
||||
"version": "2.1.8",
|
||||
"resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-2.1.8.tgz",
|
||||
"integrity": "sha512-8liAVezDmUcH+tdzoEGrhfbGcP7nOV4NkGE3a74+qqvE7nt9i4sKLGBuZNOnpI4WiGksiNPklZxva80061QiPg==",
|
||||
"dependencies": {
|
||||
"css-unit-converter": "^1.1.1",
|
||||
"postcss-value-parser": "^3.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/reduce-css-calc/node_modules/postcss-value-parser": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
|
||||
"integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ=="
|
||||
},
|
||||
"node_modules/redux": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/redux/-/redux-4.1.2.tgz",
|
||||
|
@ -26357,11 +26112,6 @@
|
|||
"@types/react-router": "*"
|
||||
}
|
||||
},
|
||||
"@types/resize-observer-browser": {
|
||||
"version": "0.1.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/resize-observer-browser/-/resize-observer-browser-0.1.6.tgz",
|
||||
"integrity": "sha512-61IfTac0s9jvNtBCpyo86QeaN8qqpMGHdK0uGKCCIy2dt5/Yk84VduHIdWAcmkC5QvdkPL0p5eWYgUZtHKKUVg=="
|
||||
},
|
||||
"@types/resolve": {
|
||||
"version": "0.0.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
|
||||
|
@ -28753,11 +28503,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"css-unit-converter": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/css-unit-converter/-/css-unit-converter-1.1.2.tgz",
|
||||
"integrity": "sha512-IiJwMC8rdZE0+xiEZHeru6YoONC4rfPMqGm2W85jMIbkFvv5nFTwJVFHam2eFrN6txmoUYFAFXiv8ICVeTO0MA=="
|
||||
},
|
||||
"css-what": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/css-what/-/css-what-5.1.0.tgz",
|
||||
|
@ -28991,11 +28736,6 @@
|
|||
"resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.3.1.tgz",
|
||||
"integrity": "sha512-V0pfhfr8suzyPGOx3nmq4aHqabehUZn6Ch9kyFpV79TGDTWFmHqUqXdabR7QHqxzrYolF4+tVmJhUG4OURg5dQ=="
|
||||
},
|
||||
"decimal.js-light": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
|
||||
"integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg=="
|
||||
},
|
||||
"decode-uri-component": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
|
||||
|
@ -29328,14 +29068,6 @@
|
|||
"utila": "~0.4"
|
||||
}
|
||||
},
|
||||
"dom-helpers": {
|
||||
"version": "3.4.0",
|
||||
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
|
||||
"integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.1.2"
|
||||
}
|
||||
},
|
||||
"dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
|
@ -30578,11 +30310,6 @@
|
|||
"integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
|
||||
"dev": true
|
||||
},
|
||||
"fast-equals": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-2.0.4.tgz",
|
||||
"integrity": "sha512-caj/ZmjHljPrZtbzJ3kfH5ia/k4mTJe/qSiXAGzxZWRZgsgDV0cvNaQULqUX8t0/JVlzzEdYOwCN5DmzTxoD4w=="
|
||||
},
|
||||
"fast-glob": {
|
||||
"version": "3.2.7",
|
||||
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.7.tgz",
|
||||
|
@ -33847,11 +33574,6 @@
|
|||
"lodash._reinterpolate": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"lodash.throttle": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
|
||||
"integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
|
||||
},
|
||||
"lodash.truncate": {
|
||||
"version": "4.4.2",
|
||||
"resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
|
||||
|
@ -36912,11 +36634,6 @@
|
|||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
},
|
||||
"react-lifecycles-compat": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
|
||||
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
|
||||
},
|
||||
"react-perfect-scrollbar": {
|
||||
"version": "1.5.8",
|
||||
"resolved": "https://registry.npmjs.org/react-perfect-scrollbar/-/react-perfect-scrollbar-1.5.8.tgz",
|
||||
|
@ -36951,17 +36668,6 @@
|
|||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz",
|
||||
"integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg=="
|
||||
},
|
||||
"react-resize-detector": {
|
||||
"version": "6.7.6",
|
||||
"resolved": "https://registry.npmjs.org/react-resize-detector/-/react-resize-detector-6.7.6.tgz",
|
||||
"integrity": "sha512-/6RZlul1yePSoYJxWxmmgjO320moeLC/khrwpEVIL+D2EjLKhqOwzFv+H8laMbImVj7Zu4FlMa0oA7au3/ChjQ==",
|
||||
"requires": {
|
||||
"@types/resize-observer-browser": "^0.1.6",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"lodash.throttle": "^4.1.1",
|
||||
"resize-observer-polyfill": "^1.5.1"
|
||||
}
|
||||
},
|
||||
"react-router": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.1.tgz",
|
||||
|
@ -37120,16 +36826,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"react-smooth": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-2.0.0.tgz",
|
||||
"integrity": "sha512-wK4dBBR6P21otowgMT9toZk+GngMplGS1O5gk+2WSiHEXIrQgDvhR5IIlT74Vtu//qpTcipkgo21dD7a7AUNxw==",
|
||||
"requires": {
|
||||
"fast-equals": "^2.0.0",
|
||||
"raf": "^3.4.0",
|
||||
"react-transition-group": "2.9.0"
|
||||
}
|
||||
},
|
||||
"react-table-drag-select": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-table-drag-select/-/react-table-drag-select-0.3.1.tgz",
|
||||
|
@ -37154,17 +36850,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"react-transition-group": {
|
||||
"version": "2.9.0",
|
||||
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
|
||||
"integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
|
||||
"requires": {
|
||||
"dom-helpers": "^3.4.0",
|
||||
"loose-envify": "^1.4.0",
|
||||
"prop-types": "^15.6.2",
|
||||
"react-lifecycles-compat": "^3.0.4"
|
||||
}
|
||||
},
|
||||
"read-pkg": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
|
||||
|
@ -37276,148 +36961,6 @@
|
|||
"picomatch": "^2.2.1"
|
||||
}
|
||||
},
|
||||
"recharts": {
|
||||
"version": "2.1.8",
|
||||
"resolved": "https://registry.npmjs.org/recharts/-/recharts-2.1.8.tgz",
|
||||
"integrity": "sha512-Wi7ufdDGyvy/BPf1za1Ok7VeWB2KtEejaewO9ulmlUhvn5l5RPS4AOkrUfhtMRTTjgJ4K6AbWMDpwtDjczUHJA==",
|
||||
"requires": {
|
||||
"@types/d3-interpolate": "^2.0.0",
|
||||
"@types/d3-scale": "^3.0.0",
|
||||
"@types/d3-shape": "^2.0.0",
|
||||
"classnames": "^2.2.5",
|
||||
"d3-interpolate": "^2.0.0",
|
||||
"d3-scale": "^3.0.0",
|
||||
"d3-shape": "^2.0.0",
|
||||
"eventemitter3": "^4.0.1",
|
||||
"lodash": "^4.17.19",
|
||||
"react-is": "^16.10.2",
|
||||
"react-resize-detector": "^6.6.3",
|
||||
"react-smooth": "^2.0.0",
|
||||
"recharts-scale": "^0.4.4",
|
||||
"reduce-css-calc": "^2.1.8"
|
||||
},
|
||||
"dependencies": {
|
||||
"@types/d3-color": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-2.0.3.tgz",
|
||||
"integrity": "sha512-+0EtEjBfKEDtH9Rk3u3kLOUXM5F+iZK+WvASPb0MhIZl8J8NUvGeZRwKCXl+P3HkYx5TdU4YtcibpqHkSR9n7w=="
|
||||
},
|
||||
"@types/d3-interpolate": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-2.0.2.tgz",
|
||||
"integrity": "sha512-lElyqlUfIPyWG/cD475vl6msPL4aMU7eJvx1//Q177L8mdXoVPFl1djIESF2FKnc0NyaHvQlJpWwKJYwAhUoCw==",
|
||||
"requires": {
|
||||
"@types/d3-color": "^2"
|
||||
}
|
||||
},
|
||||
"@types/d3-path": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-2.0.1.tgz",
|
||||
"integrity": "sha512-6K8LaFlztlhZO7mwsZg7ClRsdLg3FJRzIIi6SZXDWmmSJc2x8dd2VkESbLXdk3p8cuvz71f36S0y8Zv2AxqvQw=="
|
||||
},
|
||||
"@types/d3-scale": {
|
||||
"version": "3.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-3.3.2.tgz",
|
||||
"integrity": "sha512-gGqr7x1ost9px3FvIfUMi5XA/F/yAf4UkUDtdQhpH92XCT0Oa7zkkRzY61gPVJq+DxpHn/btouw5ohWkbBsCzQ==",
|
||||
"requires": {
|
||||
"@types/d3-time": "^2"
|
||||
}
|
||||
},
|
||||
"@types/d3-shape": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-2.1.3.tgz",
|
||||
"integrity": "sha512-HAhCel3wP93kh4/rq+7atLdybcESZ5bRHDEZUojClyZWsRuEMo3A52NGYJSh48SxfxEU6RZIVbZL2YFZ2OAlzQ==",
|
||||
"requires": {
|
||||
"@types/d3-path": "^2"
|
||||
}
|
||||
},
|
||||
"@types/d3-time": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-2.1.1.tgz",
|
||||
"integrity": "sha512-9MVYlmIgmRR31C5b4FVSWtuMmBHh2mOWQYfl7XAYOa8dsnb7iEmUmRSWSFgXFtkjxO65d7hTUHQC+RhR/9IWFg=="
|
||||
},
|
||||
"d3-array": {
|
||||
"version": "2.12.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.12.1.tgz",
|
||||
"integrity": "sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==",
|
||||
"requires": {
|
||||
"internmap": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"d3-color": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
|
||||
"integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
|
||||
},
|
||||
"d3-format": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
|
||||
"integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
|
||||
},
|
||||
"d3-interpolate": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
|
||||
"integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
|
||||
"requires": {
|
||||
"d3-color": "1 - 2"
|
||||
}
|
||||
},
|
||||
"d3-path": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-path/-/d3-path-2.0.0.tgz",
|
||||
"integrity": "sha512-ZwZQxKhBnv9yHaiWd6ZU4x5BtCQ7pXszEV9CU6kRgwIQVQGLMv1oiL4M+MK/n79sYzsj+gcgpPQSctJUsLN7fA=="
|
||||
},
|
||||
"d3-scale": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.3.0.tgz",
|
||||
"integrity": "sha512-1JGp44NQCt5d1g+Yy+GeOnZP7xHo0ii8zsQp6PGzd+C1/dl0KGsp9A7Mxwp+1D1o4unbTTxVdU/ZOIEBoeZPbQ==",
|
||||
"requires": {
|
||||
"d3-array": "^2.3.0",
|
||||
"d3-format": "1 - 2",
|
||||
"d3-interpolate": "1.2.0 - 2",
|
||||
"d3-time": "^2.1.1",
|
||||
"d3-time-format": "2 - 3"
|
||||
}
|
||||
},
|
||||
"d3-shape": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-2.1.0.tgz",
|
||||
"integrity": "sha512-PnjUqfM2PpskbSLTJvAzp2Wv4CZsnAgTfcVRTwW03QR3MkXF8Uo7B1y/lWkAsmbKwuecto++4NlsYcvYpXpTHA==",
|
||||
"requires": {
|
||||
"d3-path": "1 - 2"
|
||||
}
|
||||
},
|
||||
"d3-time": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.1.1.tgz",
|
||||
"integrity": "sha512-/eIQe/eR4kCQwq7yxi7z4c6qEXf2IYGcjoWB5OOQy4Tq9Uv39/947qlDcN2TLkiTzQWzvnsuYPB9TrWaNfipKQ==",
|
||||
"requires": {
|
||||
"d3-array": "2"
|
||||
}
|
||||
},
|
||||
"d3-time-format": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
|
||||
"integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
|
||||
"requires": {
|
||||
"d3-time": "1 - 2"
|
||||
}
|
||||
},
|
||||
"internmap": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.1.tgz",
|
||||
"integrity": "sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"recharts-scale": {
|
||||
"version": "0.4.5",
|
||||
"resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz",
|
||||
"integrity": "sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==",
|
||||
"requires": {
|
||||
"decimal.js-light": "^2.4.1"
|
||||
}
|
||||
},
|
||||
"recursive-readdir": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.2.tgz",
|
||||
|
@ -37426,22 +36969,6 @@
|
|||
"minimatch": "3.0.4"
|
||||
}
|
||||
},
|
||||
"reduce-css-calc": {
|
||||
"version": "2.1.8",
|
||||
"resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-2.1.8.tgz",
|
||||
"integrity": "sha512-8liAVezDmUcH+tdzoEGrhfbGcP7nOV4NkGE3a74+qqvE7nt9i4sKLGBuZNOnpI4WiGksiNPklZxva80061QiPg==",
|
||||
"requires": {
|
||||
"css-unit-converter": "^1.1.1",
|
||||
"postcss-value-parser": "^3.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"postcss-value-parser": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
|
||||
"integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"redux": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/redux/-/redux-4.1.2.tgz",
|
||||
|
|
|
@ -44,7 +44,6 @@
|
|||
"react-router-dom": "^5.2.1",
|
||||
"react-scripts": "^4.0.3",
|
||||
"react-table-drag-select": "^0.3.1",
|
||||
"recharts": "^2.1.8",
|
||||
"uplot": "^1.6.18",
|
||||
"uplot-react": "^1.1.1"
|
||||
},
|
||||
|
|
|
@ -1,4 +1,9 @@
|
|||
import { useEffect } from 'react';
|
||||
import {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useRef,
|
||||
useState,
|
||||
} from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import {
|
||||
Form,
|
||||
|
@ -22,6 +27,7 @@ import {
|
|||
ScalarConstant as ScalarConstantType,
|
||||
ConstantTypes,
|
||||
Tune as TuneType,
|
||||
UIState,
|
||||
} from '@speedy-tuner/types';
|
||||
import SmartSelect from './Dialog/SmartSelect';
|
||||
import SmartNumber from './Dialog/SmartNumber';
|
||||
|
@ -74,6 +80,7 @@ enum PanelTypes {
|
|||
const mapStateToProps = (state: AppState) => ({
|
||||
config: state.config,
|
||||
tune: state.tune,
|
||||
ui: state.ui,
|
||||
});
|
||||
|
||||
const containerStyle = {
|
||||
|
@ -89,12 +96,14 @@ const skeleton = (<div style={containerStyle}>
|
|||
|
||||
// TODO: refactor this
|
||||
const Dialog = ({
|
||||
ui,
|
||||
config,
|
||||
tune,
|
||||
url,
|
||||
name,
|
||||
burnButton,
|
||||
}: {
|
||||
ui: UIState,
|
||||
config: ConfigType,
|
||||
tune: TuneType,
|
||||
name: string,
|
||||
|
@ -104,10 +113,19 @@ const Dialog = ({
|
|||
const isDataReady = Object.keys(tune.constants).length && Object.keys(config.constants).length;
|
||||
const { storageSet } = useStorage();
|
||||
const { findConstantOnPage } = useConfig(config);
|
||||
const [canvasWidth, setCanvasWidth] = useState(0);
|
||||
const contentRef = useRef<HTMLDivElement | null>(null);
|
||||
const calculateCanvasWidth = useCallback(() => {
|
||||
setCanvasWidth((contentRef.current?.clientWidth || 0) - 20);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
storageSet('lastDialog', url);
|
||||
}, [storageSet, url]);
|
||||
calculateCanvasWidth();
|
||||
window.addEventListener('resize', calculateCanvasWidth);
|
||||
|
||||
return () => window.removeEventListener('resize', calculateCanvasWidth);
|
||||
}, [calculateCanvasWidth, storageSet, url, ui.sidebarCollapsed]);
|
||||
|
||||
const renderHelp = (link?: string) => (link &&
|
||||
<Popover
|
||||
|
@ -135,6 +153,7 @@ const Dialog = ({
|
|||
return (
|
||||
<Curve
|
||||
name={curve.yBins[0]}
|
||||
width={canvasWidth}
|
||||
key={curve.yBins[0]}
|
||||
disabled={false} // TODO: evaluate condition
|
||||
help={config.help[curve.yBins[0]]}
|
||||
|
@ -401,14 +420,13 @@ const Dialog = ({
|
|||
})}
|
||||
|
||||
{panel.type === PanelTypes.CURVE && renderCurve(panel)}
|
||||
|
||||
{panel.type === PanelTypes.TABLE && renderTable(panel)}
|
||||
</Col>
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<div style={containerStyle}>
|
||||
<div ref={contentRef} style={containerStyle}>
|
||||
{renderHelp(dialogConfig?.help)}
|
||||
<Form
|
||||
labelCol={{ span: 10 }}
|
||||
|
|
|
@ -2,17 +2,13 @@ import {
|
|||
Typography,
|
||||
Grid,
|
||||
} from 'antd';
|
||||
import { useState } from 'react';
|
||||
import {
|
||||
CartesianGrid,
|
||||
Line,
|
||||
LineChart,
|
||||
XAxis,
|
||||
YAxis,
|
||||
Tooltip,
|
||||
ResponsiveContainer,
|
||||
Label,
|
||||
} from 'recharts';
|
||||
useEffect,
|
||||
useState,
|
||||
} from 'react';
|
||||
import UplotReact from 'uplot-react';
|
||||
import uPlot from 'uplot';
|
||||
import touchZoomPlugin from '../../utils/uPlot/touchZoomPlugin';
|
||||
import { Colors } from '../../utils/colors';
|
||||
import LandscapeNotice from './LandscapeNotice';
|
||||
import Table from './Table';
|
||||
|
@ -21,6 +17,7 @@ const { useBreakpoint } = Grid;
|
|||
|
||||
const Curve = ({
|
||||
name,
|
||||
width,
|
||||
xLabel,
|
||||
yLabel,
|
||||
xData,
|
||||
|
@ -35,6 +32,7 @@ const Curve = ({
|
|||
yUnits = '',
|
||||
}: {
|
||||
name: string,
|
||||
width: number,
|
||||
xLabel: string,
|
||||
yLabel: string,
|
||||
xData: number[],
|
||||
|
@ -48,14 +46,49 @@ const Curve = ({
|
|||
xUnits?: string,
|
||||
yUnits?: string,
|
||||
}) => {
|
||||
const mapData = (rawData: number[][]) => rawData[1].map((val, i) => ({
|
||||
x: val,
|
||||
y: rawData[0][i],
|
||||
}));
|
||||
const [data, setData] = useState(mapData([yData, xData]));
|
||||
const { sm } = useBreakpoint();
|
||||
const margin = 15;
|
||||
const animationDuration = 500;
|
||||
const [options, setOptions] = useState<uPlot.Options>();
|
||||
const [plotData, setPlotData] = useState<uPlot.AlignedData>();
|
||||
|
||||
useEffect(() => {
|
||||
setPlotData([xData, yData]);
|
||||
setOptions({
|
||||
width,
|
||||
height: 350,
|
||||
scales: {
|
||||
x: { time: false },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
label: xLabel,
|
||||
value: (_self, val) => `${val.toLocaleString()}${xUnits}`,
|
||||
},
|
||||
{
|
||||
label: yLabel,
|
||||
value: (_self, val) => `${val.toLocaleString()}${yUnits}`,
|
||||
points: { show: false },
|
||||
stroke: Colors.ACCENT,
|
||||
width: 2,
|
||||
},
|
||||
],
|
||||
axes: [
|
||||
{
|
||||
stroke: Colors.TEXT,
|
||||
grid: { stroke: Colors.MAIN_LIGHT },
|
||||
},
|
||||
{
|
||||
label: `${yLabel} (${yUnits})`,
|
||||
stroke: Colors.TEXT,
|
||||
grid: { stroke: Colors.MAIN_LIGHT },
|
||||
},
|
||||
],
|
||||
cursor: {
|
||||
drag: { y: false },
|
||||
points: { size: 9 },
|
||||
},
|
||||
plugins: [touchZoomPlugin()],
|
||||
});
|
||||
}, [width, xData, xLabel, xUnits, yData, yLabel, yUnits]);
|
||||
|
||||
if (!sm) {
|
||||
return <LandscapeNotice />;
|
||||
|
@ -66,55 +99,7 @@ const Curve = ({
|
|||
<Typography.Paragraph>
|
||||
<Typography.Text type="secondary">{help}</Typography.Text>
|
||||
</Typography.Paragraph>
|
||||
<ResponsiveContainer height={450}>
|
||||
<LineChart
|
||||
data={data}
|
||||
margin={{
|
||||
top: margin,
|
||||
right: margin,
|
||||
left: margin,
|
||||
bottom: margin + 5,
|
||||
}}
|
||||
>
|
||||
<CartesianGrid
|
||||
strokeDasharray="4 4"
|
||||
strokeOpacity={0.1}
|
||||
/>
|
||||
<XAxis dataKey="x">
|
||||
<Label
|
||||
value={`${xLabel} (${xUnits})`}
|
||||
position="bottom"
|
||||
style={{ fill: Colors.TEXT }}
|
||||
/>
|
||||
</XAxis>
|
||||
<YAxis domain={['auto', 'auto']}>
|
||||
<Label
|
||||
value={`${yLabel} (${yUnits})`}
|
||||
position="left"
|
||||
angle={-90}
|
||||
style={{ fill: Colors.TEXT }}
|
||||
/>
|
||||
</YAxis>
|
||||
<Tooltip
|
||||
labelFormatter={(value) => `${xLabel} : ${value} ${xUnits}`}
|
||||
formatter={(value: number) => [`${value} ${yUnits}`, yLabel]}
|
||||
contentStyle={{
|
||||
backgroundColor: Colors.MAIN,
|
||||
border: 0,
|
||||
boxShadow: '0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%)',
|
||||
borderRadius: 5,
|
||||
}}
|
||||
animationDuration={animationDuration}
|
||||
/>
|
||||
<Line
|
||||
strokeWidth={3}
|
||||
type="linear"
|
||||
dataKey="y"
|
||||
stroke={Colors.ACCENT}
|
||||
animationDuration={animationDuration}
|
||||
/>
|
||||
</LineChart>
|
||||
</ResponsiveContainer>
|
||||
<UplotReact options={options!} data={plotData!} />
|
||||
<Table
|
||||
name={name}
|
||||
key={name}
|
||||
|
@ -129,7 +114,6 @@ const Curve = ({
|
|||
yMax={yMax}
|
||||
xUnits={xUnits}
|
||||
yUnits={yUnits}
|
||||
onChange={(newData: number[][]) => setData(mapData(newData))}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
|
|
|
@ -99,12 +99,12 @@ const LogCanvas = ({ data, width, height, selectedFields1, selectedFields2 }: Pr
|
|||
const field = fieldsToPlot[label];
|
||||
|
||||
dataSeries.push({
|
||||
label: field.units ? `${label} (${field.units})` : label,
|
||||
label,
|
||||
points: { show: false },
|
||||
stroke: hsl(index, selectedFieldsLength),
|
||||
scale: field.units,
|
||||
width: 2,
|
||||
value: (_self, val) => isNumber(val) ? formatNumber(val, field.format) : 0,
|
||||
value: (_self, val) => `${(isNumber(val) ? formatNumber(val, field.format) : 0)}${field.units}`,
|
||||
});
|
||||
|
||||
data.forEach((entry) => {
|
||||
|
@ -137,7 +137,10 @@ const LogCanvas = ({ data, width, height, selectedFields1, selectedFields2 }: Pr
|
|||
height,
|
||||
scales: { x: { time: false } },
|
||||
series: [
|
||||
{ label: 'Time (s)' },
|
||||
{
|
||||
label: 'Time',
|
||||
value: (_self: uPlot, val: number) => `${val.toLocaleString()}s`,
|
||||
},
|
||||
...dataSeries,
|
||||
],
|
||||
axes: [
|
||||
|
@ -148,9 +151,8 @@ const LogCanvas = ({ data, width, height, selectedFields1, selectedFields2 }: Pr
|
|||
],
|
||||
cursor: {
|
||||
drag: { y: false },
|
||||
sync: {
|
||||
key: plotSyncKey,
|
||||
},
|
||||
sync: { key: plotSyncKey },
|
||||
points: { size: 7 },
|
||||
},
|
||||
plugins: [touchZoomPlugin()],
|
||||
},
|
||||
|
@ -176,14 +178,8 @@ const LogCanvas = ({ data, width, height, selectedFields1, selectedFields2 }: Pr
|
|||
|
||||
return (
|
||||
<Space direction="vertical" size="large">
|
||||
<UplotReact
|
||||
options={options1!}
|
||||
data={plotData1!}
|
||||
/>
|
||||
<UplotReact
|
||||
options={options2!}
|
||||
data={plotData2!}
|
||||
/>
|
||||
<UplotReact options={options1!} data={plotData1!} />
|
||||
<UplotReact options={options2!} data={plotData2!} />
|
||||
</Space>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -68,9 +68,7 @@ const CompositeCanvas = ({ data, width, height }: Props) => {
|
|||
x: { time: false },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
label: 'Event',
|
||||
},
|
||||
{ label: 'Event' },
|
||||
{
|
||||
label: 'Secondary',
|
||||
points: { show: false },
|
||||
|
@ -82,7 +80,7 @@ const CompositeCanvas = ({ data, width, height }: Props) => {
|
|||
{
|
||||
label: 'Primary',
|
||||
points: { show: false },
|
||||
stroke: Colors.ACCENT,
|
||||
stroke: Colors.BLUE,
|
||||
scale: '',
|
||||
value: (_self, rawValue) => (rawValue / 2) - 1,
|
||||
width: 2,
|
||||
|
@ -103,6 +101,7 @@ const CompositeCanvas = ({ data, width, height }: Props) => {
|
|||
],
|
||||
cursor: {
|
||||
drag: { y: false },
|
||||
points: { size: 7 },
|
||||
},
|
||||
plugins: [touchZoomPlugin()],
|
||||
});
|
||||
|
@ -113,10 +112,7 @@ const CompositeCanvas = ({ data, width, height }: Props) => {
|
|||
}
|
||||
|
||||
return (
|
||||
<UplotReact
|
||||
options={options!}
|
||||
data={plotData!}
|
||||
/>
|
||||
<UplotReact options={options!} data={plotData!} />
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
@ -40,10 +40,7 @@ const ToothCanvas = ({ data, width, height }: Props) => {
|
|||
}
|
||||
});
|
||||
|
||||
setPlotData([
|
||||
xData,
|
||||
yData,
|
||||
]);
|
||||
setPlotData([xData, yData]);
|
||||
|
||||
setOptions({
|
||||
width,
|
||||
|
@ -52,15 +49,12 @@ const ToothCanvas = ({ data, width, height }: Props) => {
|
|||
x: { time: false },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
label: 'Event',
|
||||
},
|
||||
{ label: 'Event' },
|
||||
{
|
||||
label: 'Tooth time',
|
||||
points: { show: false },
|
||||
stroke: Colors.ACCENT,
|
||||
fill: Colors.ACCENT,
|
||||
scale: 'toothTime',
|
||||
value: (_self, rawValue) => `${rawValue.toLocaleString()}μs`,
|
||||
paths: bars!({ size: [0.6, 100] }),
|
||||
},
|
||||
|
@ -71,7 +65,6 @@ const ToothCanvas = ({ data, width, height }: Props) => {
|
|||
grid: { stroke: Colors.MAIN_LIGHT },
|
||||
},
|
||||
{
|
||||
scale: 'toothTime',
|
||||
label: '',
|
||||
stroke: Colors.TEXT,
|
||||
grid: { stroke: Colors.MAIN_LIGHT },
|
||||
|
@ -79,6 +72,7 @@ const ToothCanvas = ({ data, width, height }: Props) => {
|
|||
],
|
||||
cursor: {
|
||||
drag: { y: false },
|
||||
points: { size: 7 },
|
||||
},
|
||||
plugins: [touchZoomPlugin()],
|
||||
});
|
||||
|
@ -89,10 +83,7 @@ const ToothCanvas = ({ data, width, height }: Props) => {
|
|||
}
|
||||
|
||||
return (
|
||||
<UplotReact
|
||||
options={options!}
|
||||
data={plotData!}
|
||||
/>
|
||||
<UplotReact options={options!} data={plotData!} />
|
||||
);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue