[ { "path": ".asf.yaml", "content": "# Licensed to the Apache Software Foundation (ASF) under one\n# or more contributor license agreements. See the NOTICE file\n# distributed with this work for additional information\n# regarding copyright ownership. The ASF licenses this file\n# to you under the Apache License, Version 2.0 (the\n# \"License\"); you may not use this file except in compliance\n# with the License. You may obtain a copy of the License at\n#\n# http://www.apache.org/licenses/LICENSE-2.0\n#\n# Unless required by applicable law or agreed to in writing,\n# software distributed under the License is distributed on an\n# \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n# KIND, either express or implied. See the License for the\n# specific language governing permissions and limitations\n# under the License.\n\ngithub:\n description: Design your own theme for Apache ECharts.\n homepage: https://echarts.apache.org/theme-builder.html\n labels:\n - echarts\n - apache\n - theme\n ghp_branch: gh-pages\n\nnotifications:\n commits: commits@echarts.apache.org\n pullrequests: commits@echarts.apache.org\n issues: commits@echarts.apache.org\n" }, { "path": ".editorconfig", "content": "# EditorConfig helps developers define and maintain consistent\n# coding styles between different editors and IDEs\n# editorconfig.org\n\nroot = true\n\n\n[*]\n\n# Change these settings to your own preference\nindent_style = space\nindent_size = 2\n\n# We recommend you to keep these unchanged\nend_of_line = lf\ncharset = utf-8\ntrim_trailing_whitespace = true\ninsert_final_newline = true\n\n[*.md]\ntrim_trailing_whitespace = false\n\n[package.json]\nindent_style = space\nindent_size = 2\n\n[bower.json]\nindent_style = space\nindent_size = 2\n" }, { "path": ".gitattributes", "content": "* text=auto" }, { "path": ".github/workflows/deploy.yml", "content": "name: Build and Deploy\n\non:\n push:\n branches:\n - master\n\njobs:\n build-and-deploy:\n runs-on: ubuntu-latest\n steps:\n - name: Checkout 🛎️\n uses: actions/checkout@v5\n\n - name: Setup Node.js\n uses: actions/setup-node@v6\n with:\n node-version: 22\n registry-url: https://registry.npmjs.org/\n\n - name: Install and Build 🔧\n run: |\n npm i\n npm i @jamesives/github-pages-deploy-action -D\n npm run build\n\n - name: Deploy 🚀\n uses: ./node_modules/@jamesives/github-pages-deploy-action\n with:\n branch: gh-pages # The branch the action should deploy to.\n folder: dist\n target-folder: docs\n single-commit: true\n clean: true\n" }, { "path": ".gitignore", "content": "node_modules\ndist\n.tmp\n.sass-cache\napp/bower_components\ntest/bower_components\napp/vendors/echarts.js\n.DS_Store\napp\n" }, { "path": ".jshintrc", "content": "{\n \"node\": true,\n \"browser\": true,\n \"esnext\": true,\n \"bitwise\": true,\n \"camelcase\": true,\n \"curly\": true,\n \"eqeqeq\": true,\n \"immed\": true,\n \"indent\": 4,\n \"latedef\": true,\n \"newcap\": true,\n \"noarg\": true,\n \"quotmark\": \"single\",\n \"undef\": true,\n \"unused\": true,\n \"strict\": true,\n \"trailing\": true,\n \"smarttabs\": true,\n \"jquery\": true\n}\n" }, { "path": ".vscode/settings.json", "content": "{\n \"i18n-ally.localesPaths\": [\n \"src/locales\"\n ],\n \"typescript.tsdk\": \"./node_modules/typescript/lib\",\n \"typescript.enablePromptUseWorkspaceTsdk\": true\n}\n" }, { "path": ".yo-rc.json", "content": "{\n \"generator-mocha\": {\n \"ui\": \"bdd\",\n \"rjs\": false\n }\n}" }, { "path": "LICENSE", "content": "\n Apache License\n Version 2.0, January 2004\n http://www.apache.org/licenses/\n\nTERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION\n\n1. Definitions.\n\n \"License\" shall mean the terms and conditions for use, reproduction,\n and distribution as defined by Sections 1 through 9 of this document.\n\n \"Licensor\" shall mean the copyright owner or entity authorized by\n the copyright owner that is granting the License.\n\n \"Legal Entity\" shall mean the union of the acting entity and all\n other entities that control, are controlled by, or are under common\n control with that entity. For the purposes of this definition,\n \"control\" means (i) the power, direct or indirect, to cause the\n direction or management of such entity, whether by contract or\n otherwise, or (ii) ownership of fifty percent (50%) or more of the\n outstanding shares, or (iii) beneficial ownership of such entity.\n\n \"You\" (or \"Your\") shall mean an individual or Legal Entity\n exercising permissions granted by this License.\n\n \"Source\" form shall mean the preferred form for making modifications,\n including but not limited to software source code, documentation\n source, and configuration files.\n\n \"Object\" form shall mean any form resulting from mechanical\n transformation or translation of a Source form, including but\n not limited to compiled object code, generated documentation,\n and conversions to other media types.\n\n \"Work\" shall mean the work of authorship, whether in Source or\n Object form, made available under the License, as indicated by a\n copyright notice that is included in or attached to the work\n (an example is provided in the Appendix below).\n\n \"Derivative Works\" shall mean any work, whether in Source or Object\n form, that is based on (or derived from) the Work and for which the\n editorial revisions, annotations, elaborations, or other modifications\n represent, as a whole, an original work of authorship. For the purposes\n of this License, Derivative Works shall not include works that remain\n separable from, or merely link (or bind by name) to the interfaces of,\n the Work and Derivative Works thereof.\n\n \"Contribution\" shall mean any work of authorship, including\n the original version of the Work and any modifications or additions\n to that Work or Derivative Works thereof, that is intentionally\n submitted to Licensor for inclusion in the Work by the copyright owner\n or by an individual or Legal Entity authorized to submit on behalf of\n the copyright owner. For the purposes of this definition, \"submitted\"\n means any form of electronic, verbal, or written communication sent\n to the Licensor or its representatives, including but not limited to\n communication on electronic mailing lists, source code control systems,\n and issue tracking systems that are managed by, or on behalf of, the\n Licensor for the purpose of discussing and improving the Work, but\n excluding communication that is conspicuously marked or otherwise\n designated in writing by the copyright owner as \"Not a Contribution.\"\n\n \"Contributor\" shall mean Licensor and any individual or Legal Entity\n on behalf of whom a Contribution has been received by Licensor and\n subsequently incorporated within the Work.\n\n2. Grant of Copyright License. Subject to the terms and conditions of\n this License, each Contributor hereby grants to You a perpetual,\n worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n copyright license to reproduce, prepare Derivative Works of,\n publicly display, publicly perform, sublicense, and distribute the\n Work and such Derivative Works in Source or Object form.\n\n3. Grant of Patent License. Subject to the terms and conditions of\n this License, each Contributor hereby grants to You a perpetual,\n worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n (except as stated in this section) patent license to make, have made,\n use, offer to sell, sell, import, and otherwise transfer the Work,\n where such license applies only to those patent claims licensable\n by such Contributor that are necessarily infringed by their\n Contribution(s) alone or by combination of their Contribution(s)\n with the Work to which such Contribution(s) was submitted. If You\n institute patent litigation against any entity (including a\n cross-claim or counterclaim in a lawsuit) alleging that the Work\n or a Contribution incorporated within the Work constitutes direct\n or contributory patent infringement, then any patent licenses\n granted to You under this License for that Work shall terminate\n as of the date such litigation is filed.\n\n4. Redistribution. You may reproduce and distribute copies of the\n Work or Derivative Works thereof in any medium, with or without\n modifications, and in Source or Object form, provided that You\n meet the following conditions:\n\n (a) You must give any other recipients of the Work or\n Derivative Works a copy of this License; and\n\n (b) You must cause any modified files to carry prominent notices\n stating that You changed the files; and\n\n (c) You must retain, in the Source form of any Derivative Works\n that You distribute, all copyright, patent, trademark, and\n attribution notices from the Source form of the Work,\n excluding those notices that do not pertain to any part of\n the Derivative Works; and\n\n (d) If the Work includes a \"NOTICE\" text file as part of its\n distribution, then any Derivative Works that You distribute must\n include a readable copy of the attribution notices contained\n within such NOTICE file, excluding those notices that do not\n pertain to any part of the Derivative Works, in at least one\n of the following places: within a NOTICE text file distributed\n as part of the Derivative Works; within the Source form or\n documentation, if provided along with the Derivative Works; or,\n within a display generated by the Derivative Works, if and\n wherever such third-party notices normally appear. The contents\n of the NOTICE file are for informational purposes only and\n do not modify the License. You may add Your own attribution\n notices within Derivative Works that You distribute, alongside\n or as an addendum to the NOTICE text from the Work, provided\n that such additional attribution notices cannot be construed\n as modifying the License.\n\n You may add Your own copyright statement to Your modifications and\n may provide additional or different license terms and conditions\n for use, reproduction, or distribution of Your modifications, or\n for any such Derivative Works as a whole, provided Your use,\n reproduction, and distribution of the Work otherwise complies with\n the conditions stated in this License.\n\n5. Submission of Contributions. Unless You explicitly state otherwise,\n any Contribution intentionally submitted for inclusion in the Work\n by You to the Licensor shall be under the terms and conditions of\n this License, without any additional terms or conditions.\n Notwithstanding the above, nothing herein shall supersede or modify\n the terms of any separate license agreement you may have executed\n with Licensor regarding such Contributions.\n\n6. Trademarks. This License does not grant permission to use the trade\n names, trademarks, service marks, or product names of the Licensor,\n except as required for reasonable and customary use in describing the\n origin of the Work and reproducing the content of the NOTICE file.\n\n7. Disclaimer of Warranty. Unless required by applicable law or\n agreed to in writing, Licensor provides the Work (and each\n Contributor provides its Contributions) on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\n implied, including, without limitation, any warranties or conditions\n of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A\n PARTICULAR PURPOSE. You are solely responsible for determining the\n appropriateness of using or redistributing the Work and assume any\n risks associated with Your exercise of permissions under this License.\n\n8. Limitation of Liability. In no event and under no legal theory,\n whether in tort (including negligence), contract, or otherwise,\n unless required by applicable law (such as deliberate and grossly\n negligent acts) or agreed to in writing, shall any Contributor be\n liable to You for damages, including any direct, indirect, special,\n incidental, or consequential damages of any character arising as a\n result of this License or out of the use or inability to use the\n Work (including but not limited to damages for loss of goodwill,\n work stoppage, computer failure or malfunction, or any and all\n other commercial damages or losses), even if such Contributor\n has been advised of the possibility of such damages.\n\n9. Accepting Warranty or Additional Liability. While redistributing\n the Work or Derivative Works thereof, You may choose to offer,\n and charge a fee for, acceptance of support, warranty, indemnity,\n or other liability obligations and/or rights consistent with this\n License. However, in accepting such obligations, You may act only\n on Your own behalf and on Your sole responsibility, not on behalf\n of any other Contributor, and only if You agree to indemnify,\n defend, and hold each Contributor harmless for any liability\n incurred by, or claims asserted against, such Contributor by reason\n of your accepting any such warranty or additional liability.\n\nEND OF TERMS AND CONDITIONS\n\nAPPENDIX: How to apply the Apache License to your work.\n\n To apply the Apache License to your work, attach the following\n boilerplate notice, with the fields enclosed by brackets \"[]\"\n replaced with your own identifying information. (Don't include\n the brackets!) The text should be enclosed in the appropriate\n comment syntax for the file format. We also recommend that a\n file or class name and description of purpose be included on the\n same \"printed page\" as the copyright notice for easier\n identification within third-party archives.\n\nCopyright [yyyy] [name of copyright owner]\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n" }, { "path": "README.md", "content": "# Apache ECharts Theme Builder\n\nDesign your own theme for Apache ECharts.\n\n[Online Theme Builder](https://echarts.apache.org/theme-builder.html)\n\n[![Build and Deploy](https://github.com/apache/echarts-theme-builder/actions/workflows/deploy.yml/badge.svg)](https://github.com/apache/echarts-theme-builder/actions/workflows/deploy.yml)\n\n\n## Build\n\n```bash\nnpm i\nnpm run build\n```\n\n## Release to echarts-www\n\nUpdate the [echarts-www](https://github.com/apache/echarts-www) and [echarts-website](https://github.com/apache/echarts-website) project path in `config/env.asf.js` before run\n\n```bash\nnpm run release\n```\n\nIt will generate the html to the `_generated` folder of [echarts-www](https://github.com/apache/echarts-www) and other resources to the [echarts-website](https://github.com/apache/echarts-website) folder.\n" }, { "path": "app.html", "content": "\n
\n" }, { "path": "config/env.asf.js", "content": "import path from 'path';\nimport { fileURLToPath } from 'url';\n\n// Get __dirname equivalent in ESM\nconst __filename = fileURLToPath(import.meta.url);\nconst __dirname = path.dirname(__filename);\n\nexport default {\n releaseDestDir: path.resolve(__dirname, '../../echarts-website'),\n ecWWWGeneratedDir: path.resolve(__dirname, '../../echarts-www/_generated')\n};\n" }, { "path": "index.html", "content": "\n\n \n \n \n \n Apache ECharts Theme Builder\n \n \n %VITE_EXTERNAL_ECHARTS_SCRIPT%\n \n \n
\n \n \n\n" }, { "path": "package.json", "content": "{\n \"name\": \"echarts-theme-builder\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vue-tsc -b && vite build && vite build --mode app\",\n \"serve:dist\": \"http-server dist\",\n \"serve:app\": \"http-server app\",\n \"release\": \"vue-tsc -b && vite build --mode app && node scripts/release.js\"\n },\n \"dependencies\": {\n \"colorthief\": \"^3.3.1\",\n \"vant\": \"^4.9.24\",\n \"vue\": \"^3.5.31\",\n \"vue-i18n\": \"^9.14.5\",\n \"vue3-colorpicker\": \"^2.3.0\"\n },\n \"devDependencies\": {\n \"@types/fs-extra\": \"^11.0.4\",\n \"@types/node\": \"^25.5.0\",\n \"@vitejs/plugin-vue\": \"^6.0.5\",\n \"@vue/tsconfig\": \"^0.9.1\",\n \"copy-dir\": \"^1.3.0\",\n \"echarts\": \"^6.0.0\",\n \"fs-extra\": \"^11.3.4\",\n \"typescript\": \"~5.8.3\",\n \"vite\": \"^7.3.2\",\n \"vite-plugin-static-copy\": \"^3.4.0\",\n \"vue-tsc\": \"^3.2.6\"\n }\n}\n" }, { "path": "public/themes/chalk.json", "content": "{\n \"version\": 1,\n \"themeName\": \"chalk\",\n \"theme\": {\n \"seriesCnt\": \"3\",\n \"backgroundColor\": \"rgba(41,52,65,1)\",\n \"titleColor\": \"#ffffff\",\n \"subtitleColor\": \"#dddddd\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#293441\",\n \"color\": [\n \"#fc97af\",\n \"#87f7cf\",\n \"#f7f494\",\n \"#72ccff\",\n \"#f7c5a0\",\n \"#d4a4eb\",\n \"#d2f5a6\",\n \"#76f2f2\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#fc97af\",\n \"#87f7cf\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#fc97af\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#fc97af\",\n \"kBorderColor0\": \"#87f7cf\",\n \"kBorderWidth\": \"2\",\n \"lineWidth\": \"3\",\n \"symbolSize\": \"0\",\n \"symbol\": \"circle\",\n \"symbolBorderWidth\": \"4\",\n \"lineSmooth\": true,\n \"graphLineWidth\": \"1\",\n \"graphLineColor\": \"#ffffff\",\n \"mapLabelColor\": \"#893448\",\n \"mapLabelColorE\": \"rgb(137,52,72)\",\n \"mapBorderColor\": \"#999999\",\n \"mapBorderColorE\": \"#eb8146\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#f3f3f3\",\n \"mapAreaColorE\": \"rgba(255,178,72,1)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#666666\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#aaaaaa\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#e6e6e6\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#87f7cf\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#87f7cf\",\n \"timelineItemColorE\": \"#f7f494\",\n \"timelineCheckColor\": \"#fc97af\",\n \"timelineCheckBorderColor\": \"rgba(252,151,175,0.3)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#87f7cf\",\n \"timelineControlBorderColor\": \"#87f7cf\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#87f7cf\",\n \"datazoomBackgroundColor\": \"rgba(255,255,255,0)\",\n \"datazoomDataColor\": \"rgba(114,204,255,1)\",\n \"datazoomFillColor\": \"rgba(114,204,255,0.2)\",\n \"datazoomHandleColor\": \"#72ccff\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/dark.json", "content": "{\n \"version\": 1,\n \"themeName\": \"dark\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(51,51,51,1)\",\n \"titleColor\": \"#eeeeee\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#dd6b66\",\n \"#759aa0\",\n \"#e69d87\",\n \"#8dc1a9\",\n \"#ea7e53\",\n \"#eedd78\",\n \"#73a373\",\n \"#73b9bc\",\n \"#7289ab\",\n \"#91ca8c\",\n \"#f49f42\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#bf444c\",\n \"#d88273\",\n \"#f6efa6\"\n ],\n \"legendTextColor\": \"#eeeeee\",\n \"kColor\": \"#fd1050\",\n \"kColor0\": \"#0cf49b\",\n \"kBorderColor\": \"#fd1050\",\n \"kBorderColor0\": \"#0cf49b\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"circle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#444\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eee\",\n \"mapAreaColorE\": \"rgba(255,215,0,0.8)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#eeeeee\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#eeeeee\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#eeeeee\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#aaaaaa\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"#eeeeee\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999\",\n \"toolboxEmphasisColor\": \"#666\",\n \"tooltipAxisColor\": \"#eeeeee\",\n \"tooltipAxisWidth\": \"1\",\n \"timelineLineColor\": \"#eeeeee\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#dd6b66\",\n \"timelineItemColorE\": \"#a9334c\",\n \"timelineCheckColor\": \"#e43c59\",\n \"timelineCheckBorderColor\": \"rgba(194,53,49, 0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#eeeeee\",\n \"timelineControlBorderColor\": \"#eeeeee\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#eeeeee\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"rgba(255,255,255,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#eeeeee\"\n }\n}\n" }, { "path": "public/themes/default.json", "content": "{\n \"version\": 1,\n \"themeName\": \"default\",\n \"theme\": {\n \"seriesCnt\": 3,\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#333333\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#c23531\",\n \"#2f4554\",\n \"#61a0a8\",\n \"#d48265\",\n \"#91c7ae\",\n \"#749f83\",\n \"#ca8622\",\n \"#bda29a\",\n \"#6e7074\",\n \"#546570\",\n \"#c4ccd3\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#bf444c\",\n \"#d88273\",\n \"#f6efa6\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#c23531\",\n \"kColor0\": \"#314656\",\n \"kBorderColor\": \"#c23531\",\n \"kBorderColor0\": \"#314656\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000000\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#444444\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eeeeee\",\n \"mapAreaColorE\": \"rgba(255,215,0,0.8)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#293c55\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#293c55\",\n \"timelineItemColorE\": \"#a9334c\",\n \"timelineCheckColor\": \"#e43c59\",\n \"timelineCheckBorderColor\": \"rgba(194,53,49, 0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#293c55\",\n \"timelineControlBorderColor\": \"#293c55\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#293c55\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"rgba(47,69,84,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/essos.json", "content": "{\n \"version\": 1,\n \"themeName\": \"essos\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(242,234,191,0.15)\",\n \"titleColor\": \"#893448\",\n \"subtitleColor\": \"#d95850\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#ffffff\",\n \"color\": [\n \"#893448\",\n \"#d95850\",\n \"#eb8146\",\n \"#ffb248\",\n \"#f2d643\",\n \"#ebdba4\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#893448\",\n \"#d95850\",\n \"#eb8146\",\n \"#ffb248\",\n \"#f2d643\",\n \"rgb(247,238,173)\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#eb8146\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#d95850\",\n \"kBorderColor0\": \"#58c470\",\n \"kBorderWidth\": \"2\",\n \"lineWidth\": \"2\",\n \"symbolSize\": \"6\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": true,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#893448\",\n \"mapLabelColorE\": \"#893448\",\n \"mapBorderColor\": \"#999999\",\n \"mapBorderColorE\": \"#eb8146\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#f3f3f3\",\n \"mapAreaColorE\": \"#ffb248\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#aaaaaa\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#999999\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#e6e6e6\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999\",\n \"toolboxEmphasisColor\": \"#666\",\n \"tooltipAxisColor\": \"#ccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#893448\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#893448\",\n \"timelineItemColorE\": \"#ffb248\",\n \"timelineCheckColor\": \"#eb8146\",\n \"timelineCheckBorderColor\": \"rgba(255,178,72,0.41)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#893448\",\n \"timelineControlBorderColor\": \"#893448\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#893448\",\n \"datazoomBackgroundColor\": \"rgba(255,255,255,0)\",\n \"datazoomDataColor\": \"rgba(255,178,72,0.5)\",\n \"datazoomFillColor\": \"rgba(255,178,72,0.15)\",\n \"datazoomHandleColor\": \"#ffb248\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333\"\n }\n}\n" }, { "path": "public/themes/halloween.json", "content": "{\n \"version\": 1,\n \"themeName\": \"halloween\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(64,64,64,0.5)\",\n \"titleColor\": \"#ffaf51\",\n \"subtitleColor\": \"#eeeeee\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#333333\",\n \"color\": [\n \"#ff715e\",\n \"#ffaf51\",\n \"#ffee51\",\n \"#8c6ac4\",\n \"#715c87\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": \"0\",\n \"visualMapColor\": [\n \"#ff715e\",\n \"#ffee51\",\n \"#797fba\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#ffee51\",\n \"kColor0\": \"rgba(255,255,255,0)\",\n \"kBorderColor\": \"#ff715e\",\n \"kBorderColor0\": \"#797fba\",\n \"kBorderWidth\": \"1\",\n \"lineWidth\": \"3\",\n \"symbolSize\": \"8\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": false,\n \"graphLineWidth\": \"1\",\n \"graphLineColor\": \"#888888\",\n \"mapLabelColor\": \"#ffffff\",\n \"mapLabelColorE\": \"#ffee51\",\n \"mapBorderColor\": \"#999999\",\n \"mapBorderColorE\": \"#ffaf51\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#555555\",\n \"mapAreaColorE\": \"rgba(255,175,81,0.5)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#666666\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#999999\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#555555\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#ffaf51\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#ffaf51\",\n \"timelineItemColorE\": \"#ffaf51\",\n \"timelineCheckColor\": \"#ff715e\",\n \"timelineCheckBorderColor\": \"rgba(255,113,94,0.4)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#ffaf51\",\n \"timelineControlBorderColor\": \"#ffaf51\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#ff715e\",\n \"datazoomBackgroundColor\": \"rgba(255,255,255,0)\",\n \"datazoomDataColor\": \"rgba(222,222,222,1)\",\n \"datazoomFillColor\": \"rgba(255,113,94,0.2)\",\n \"datazoomHandleColor\": \"#cccccc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#999999\"\n }\n}\n" }, { "path": "public/themes/infographic.json", "content": "{\n \"version\": 1,\n \"themeName\": \"infographic\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#27727b\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#c1232b\",\n \"#27727b\",\n \"#fcce10\",\n \"#e87c25\",\n \"#b5c334\",\n \"#fe8463\",\n \"#9bca63\",\n \"#fad860\",\n \"#f3a43b\",\n \"#60c0dd\",\n \"#d7504b\",\n \"#c6e579\",\n \"#f4e001\",\n \"#f0805a\",\n \"#26c0c0\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#c1232b\",\n \"#fcce10\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#c1232b\",\n \"kColor0\": \"#b5c334\",\n \"kBorderColor\": \"#c1232b\",\n \"kBorderColor0\": \"#b5c334\",\n \"kBorderWidth\": 1,\n \"lineWidth\": \"3\",\n \"symbolSize\": \"5\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#c1232b\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#eeeeee\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#dddddd\",\n \"mapAreaColorE\": \"#fe994e\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#27727b\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#27727b\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": false,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#27727b\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#27727b\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#c1232b\",\n \"toolboxEmphasisColor\": \"#e87c25\",\n \"tooltipAxisColor\": \"#27727b\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#293c55\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#27727b\",\n \"timelineItemColorE\": \"#72d4e0\",\n \"timelineCheckColor\": \"#c1232b\",\n \"timelineCheckBorderColor\": \"rgba(194,53,49, 0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#27727b\",\n \"timelineControlBorderColor\": \"#27727b\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#293c55\",\n \"datazoomBackgroundColor\": \"rgba(0,0,0,0)\",\n \"datazoomDataColor\": \"rgba(181,195,52,0.3)\",\n \"datazoomFillColor\": \"rgba(181,195,52,0.2)\",\n \"datazoomHandleColor\": \"#27727b\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#999999\"\n }\n}\n" }, { "path": "public/themes/macarons.json", "content": "{\n \"version\": 1,\n \"themeName\": \"macarons\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#008acd\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#2ec7c9\",\n \"#b6a2de\",\n \"#5ab1ef\",\n \"#ffb980\",\n \"#d87a80\",\n \"#8d98b3\",\n \"#e5cf0d\",\n \"#97b552\",\n \"#95706d\",\n \"#dc69aa\",\n \"#07a2a4\",\n \"#9a7fd1\",\n \"#588dd5\",\n \"#f5994e\",\n \"#c05050\",\n \"#59678c\",\n \"#c9ab00\",\n \"#7eb00a\",\n \"#6f5553\",\n \"#c14089\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#5ab1ef\",\n \"#e0ffff\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#d87a80\",\n \"kColor0\": \"#2ec7c9\",\n \"kBorderColor\": \"#d87a80\",\n \"kBorderColor0\": \"#2ec7c9\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 3,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": true,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#d87a80\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#eeeeee\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#dddddd\",\n \"mapAreaColorE\": \"rgba(254,153,78,1)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#eeeeee\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#eeeeee\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#eeeeee\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#aaaaaa\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"#eeeeee\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#008acd\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#eee\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#008acd\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eee\"\n ],\n \"splitAreaShow\": true,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#008acd\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eee\"\n ],\n \"splitAreaShow\": true,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#008acd\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eee\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#2ec7c9\",\n \"toolboxEmphasisColor\": \"#18a4a6\",\n \"tooltipAxisColor\": \"#008acd\",\n \"tooltipAxisWidth\": \"1\",\n \"timelineLineColor\": \"#008acd\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#008acd\",\n \"timelineItemColorE\": \"#a9334c\",\n \"timelineCheckColor\": \"#2ec7c9\",\n \"timelineCheckBorderColor\": \"rgba(46,199,201,0.4)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#008acd\",\n \"timelineControlBorderColor\": \"#008acd\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#008acd\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"#efefff\",\n \"datazoomFillColor\": \"rgba(182,162,222,0.2)\",\n \"datazoomHandleColor\": \"#008acd\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/purple-passion.json", "content": "{\n \"version\": 1,\n \"themeName\": \"purple-passion\",\n \"theme\": {\n \"seriesCnt\": \"3\",\n \"backgroundColor\": \"rgba(91,92,110,1)\",\n \"titleColor\": \"#ffffff\",\n \"subtitleColor\": \"#cccccc\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#9b8bba\",\n \"#e098c7\",\n \"#8fd3e8\",\n \"#71669e\",\n \"#cc70af\",\n \"#7cb4cc\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#8a7ca8\",\n \"#e098c7\",\n \"#cceffa\"\n ],\n \"legendTextColor\": \"#cccccc\",\n \"kColor\": \"#e098c7\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#e098c7\",\n \"kBorderColor0\": \"#8fd3e8\",\n \"kBorderWidth\": \"2\",\n \"lineWidth\": \"3\",\n \"symbolSize\": \"7\",\n \"symbol\": \"circle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": true,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000\",\n \"mapLabelColorE\": \"#ffffff\",\n \"mapBorderColor\": \"#444\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eee\",\n \"mapAreaColorE\": \"#e098c7\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#cccccc\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#cccccc\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#eeeeee\",\n \"#333333\"\n ],\n \"splitAreaShow\": true,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999\",\n \"toolboxEmphasisColor\": \"#666\",\n \"tooltipAxisColor\": \"#ccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#8fd3e8\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#8fd3e8\",\n \"timelineItemColorE\": \"#8fd3e8\",\n \"timelineCheckColor\": \"#8fd3e8\",\n \"timelineCheckBorderColor\": \"rgba(138,124,168,0.37)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#8fd3e8\",\n \"timelineControlBorderColor\": \"#8fd3e8\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#8fd3e8\",\n \"datazoomBackgroundColor\": \"rgba(0,0,0,0)\",\n \"datazoomDataColor\": \"rgba(255,255,255,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333\"\n }\n}\n" }, { "path": "public/themes/roma.json", "content": "{\n \"version\": 1,\n \"themeName\": \"roma\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#333333\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#e01f54\",\n \"#001852\",\n \"#f5e8c8\",\n \"#b8d2c7\",\n \"#c6b38e\",\n \"#a4d8c2\",\n \"#f3d999\",\n \"#d3758f\",\n \"#dcc392\",\n \"#2e4783\",\n \"#82b6e9\",\n \"#ff6347\",\n \"#a092f1\",\n \"#0a915d\",\n \"#eaf889\",\n \"#6699FF\",\n \"#ff6666\",\n \"#3cb371\",\n \"#d5b158\",\n \"#38b6b6\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#e01f54\",\n \"#e7dbc3\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#e01f54\",\n \"kColor0\": \"#001852\",\n \"kBorderColor\": \"#f5e8c8\",\n \"kBorderColor0\": \"#b8d2c7\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000000\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#444444\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eeeeee\",\n \"mapAreaColorE\": \"rgba(255,215,0,0.8)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#293c55\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#293c55\",\n \"timelineItemColorE\": \"#a9334c\",\n \"timelineCheckColor\": \"#e43c59\",\n \"timelineCheckBorderColor\": \"rgba(194,53,49,0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#293c55\",\n \"timelineControlBorderColor\": \"#293c55\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#293c55\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"rgba(47,69,84,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/shine.json", "content": "{\n \"version\": 1,\n \"themeName\": \"shine\",\n \"theme\": {\n \"seriesCnt\": 4,\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#333333\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#c12e34\",\"#e6b600\",\"#0098d9\",\"#2b821d\",\n \"#005eaa\",\"#339ca8\",\"#cda819\",\"#32a487\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#1790cf\",\n \"#a2d4e6\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#c12e34\",\n \"kColor0\": \"#2b821d\",\n \"kBorderColor\": \"#c12e34\",\n \"kBorderColor0\": \"#2b821d\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#c12e34\",\n \"mapLabelColorE\": \"#c12e34\",\n \"mapBorderColor\": \"#eee\",\n \"mapBorderColorE\": \"#ddd\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#ddd\",\n \"mapAreaColorE\": \"#e6b600\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#06467c\",\n \"toolboxEmphasisColor\": \"#4187c2\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#005eaa\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#005eaa\",\n \"timelineItemColorE\": \"#005eaa\",\n \"timelineCheckColor\": \"#005eaa\",\n \"timelineCheckBorderColor\": \"rgba(49,107,194,0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#005eaa\",\n \"timelineControlBorderColor\": \"#005eaa\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#005eaa\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"rgba(47,69,84,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/v5.json", "content": "{\n \"version\": 1,\n \"themeName\": \"v5\",\n \"theme\": {\n \"seriesCnt\": 3,\n \"backgroundColor\": \"rgba(0, 0, 0, 0)\",\n \"titleColor\": \"#464646\",\n \"subtitleColor\": \"#6E7079\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#5470c6\",\n \"#91cc75\",\n \"#fac858\",\n \"#ee6666\",\n \"#73c0de\",\n \"#3ba272\",\n \"#fc8452\",\n \"#9a60b4\",\n \"#ea7ccc\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#bf444c\",\n \"#d88273\",\n \"#f6efa6\"\n ],\n \"legendTextColor\": \"#333\",\n \"kColor\": \"#eb5454\",\n \"kColor0\": \"#47b262\",\n \"kBorderColor\": \"#eb5454\",\n \"kBorderColor0\": \"#47b262\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#444\",\n \"mapBorderColorE\": \"#444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eee\",\n \"mapAreaColorE\": \"rgba(255,215,0,0.8)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"General Axis\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#6E7079\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#6E7079\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#6E7079\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#E0E6F1\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.2)\",\n \"rgba(210,219,238,0.2)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"Category Axis\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#6E7079\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#6E7079\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#6E7079\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#E0E6F1\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.2)\",\n \"rgba(210,219,238,0.2)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"Value Axis\",\n \"axisLineShow\": false,\n \"axisLineColor\": \"#6E7079\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#6E7079\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#6E7079\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#E0E6F1\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.2)\",\n \"rgba(210,219,238,0.2)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"Log Axis\",\n \"axisLineShow\": false,\n \"axisLineColor\": \"#6E7079\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#6E7079\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#6E7079\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#E0E6F1\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.2)\",\n \"rgba(210,219,238,0.2)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"Time Axis\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#6E7079\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#6E7079\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#6E7079\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#E0E6F1\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.2)\",\n \"rgba(210,219,238,0.2)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#999\",\n \"toolboxEmphasisColor\": \"#666\",\n \"tooltipAxisColor\": \"#ccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#DAE1F5\",\n \"timelineLineWidth\": 2,\n \"timelineItemColor\": \"#A4B1D7\",\n \"timelineItemColorE\": \"#FFF\",\n \"timelineCheckColor\": \"#316bf3\",\n \"timelineCheckBorderColor\": \"#fff\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#A4B1D7\",\n \"timelineControlBorderColor\": \"#A4B1D7\",\n \"timelineControlBorderWidth\": 1,\n \"timelineLabelColor\": \"#A4B1D7\",\n \"gridLeft\": \"10%\",\n \"gridTop\": 60,\n \"gridBottom\": 70,\n \"gridRight\": \"10%\",\n \"legendLeft\": \"center\",\n \"legendRight\": \"\",\n \"legendTop\": 0,\n \"legendBottom\": \"\"\n }\n}\n" }, { "path": "public/themes/vintage.json", "content": "{\n \"version\": 1,\n \"themeName\": \"vintage\",\n \"theme\": {\n \"seriesCnt\": 4,\n \"backgroundColor\": \"rgba(254,248,239,1)\",\n \"titleColor\": \"#333333\",\n \"subtitleColor\": \"#aaa\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#d87c7c\",\n \"#919e8b\",\n \"#d7ab82\",\n \"#6e7074\",\n \"#61a0a8\",\n \"#efa18d\",\n \"#787464\",\n \"#cc7e63\",\n \"#724e58\",\n \"#4b565b\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#bf444c\",\n \"#d88273\",\n \"#f6efa6\"\n ],\n \"legendTextColor\": \"#333333\",\n \"kColor\": \"#c23531\",\n \"kColor0\": \"#314656\",\n \"kBorderColor\": \"#c23531\",\n \"kBorderColor0\": \"#314656\",\n \"kBorderWidth\": 1,\n \"lineWidth\": 2,\n \"symbolSize\": 4,\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": 1,\n \"lineSmooth\": false,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000000\",\n \"mapLabelColorE\": \"rgb(100,0,0)\",\n \"mapBorderColor\": \"#444444\",\n \"mapBorderColorE\": \"#444444\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eeeeee\",\n \"mapAreaColorE\": \"rgba(255,215,0,0.8)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": true,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#293c55\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#293c55\",\n \"timelineItemColorE\": \"#a9334c\",\n \"timelineCheckColor\": \"#e43c59\",\n \"timelineCheckBorderColor\": \"rgba(194,53,49,0.5)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#293c55\",\n \"timelineControlBorderColor\": \"#293c55\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#293c55\",\n \"datazoomBackgroundColor\": \"rgba(47,69,84,0)\",\n \"datazoomDataColor\": \"rgba(47,69,84,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333333\"\n }\n}\n" }, { "path": "public/themes/walden.json", "content": "{\n \"version\": 1,\n \"themeName\": \"walden\",\n \"theme\": {\n \"seriesCnt\": \"3\",\n \"backgroundColor\": \"rgba(252,252,252,0)\",\n \"titleColor\": \"#666666\",\n \"subtitleColor\": \"#999999\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#ffffff\",\n \"color\": [\n \"#3fb1e3\",\n \"#6be6c1\",\n \"#626c91\",\n \"#a0a7e6\",\n \"#c4ebad\",\n \"#96dee8\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#2a99c9\",\n \"#afe8ff\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#e6a0d2\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#e6a0d2\",\n \"kBorderColor0\": \"#3fb1e3\",\n \"kBorderWidth\": \"2\",\n \"lineWidth\": \"3\",\n \"symbolSize\": \"8\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": false,\n \"graphLineWidth\": \"1\",\n \"graphLineColor\": \"#cccccc\",\n \"mapLabelColor\": \"#ffffff\",\n \"mapLabelColorE\": \"#3fb1e3\",\n \"mapBorderColor\": \"#aaaaaa\",\n \"mapBorderColorE\": \"#3fb1e3\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eeeeee\",\n \"mapAreaColorE\": \"rgba(63,177,227,0.25)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#cccccc\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#999999\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eeeeee\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#626c91\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#626c91\",\n \"timelineItemColorE\": \"#626c91\",\n \"timelineCheckColor\": \"#3fb1e3\",\n \"timelineCheckBorderColor\": \"rgba(63,177,227,0.15)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#626c91\",\n \"timelineControlBorderColor\": \"#626c91\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#626c91\",\n \"datazoomBackgroundColor\": \"rgba(255,255,255,0)\",\n \"datazoomDataColor\": \"rgba(222,222,222,1)\",\n \"datazoomFillColor\": \"rgba(114,230,212,0.25)\",\n \"datazoomHandleColor\": \"#cccccc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#999999\"\n }\n}\n" }, { "path": "public/themes/westeros.json", "content": "{\n \"version\": 1,\n \"themeName\": \"westeros\",\n \"theme\": {\n \"seriesCnt\": \"4\",\n \"backgroundColor\": \"rgba(0,0,0,0)\",\n \"titleColor\": \"#516b91\",\n \"subtitleColor\": \"#93b7e3\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#eee\",\n \"color\": [\n \"#516b91\",\n \"#59c4e6\",\n \"#edafda\",\n \"#93b7e3\",\n \"#a5e7f0\",\n \"#cbb0e3\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#516b91\",\n \"#59c4e6\",\n \"#a5e7f0\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#edafda\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#d680bc\",\n \"kBorderColor0\": \"#8fd3e8\",\n \"kBorderWidth\": \"2\",\n \"lineWidth\": \"2\",\n \"symbolSize\": \"6\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": true,\n \"graphLineWidth\": 1,\n \"graphLineColor\": \"#aaa\",\n \"mapLabelColor\": \"#000\",\n \"mapLabelColorE\": \"#516b91\",\n \"mapBorderColor\": \"#516b91\",\n \"mapBorderColorE\": \"#516b91\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#f3f3f3\",\n \"mapAreaColorE\": \"#a5e7f0\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#cccccc\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#999999\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eeeeee\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999\",\n \"toolboxEmphasisColor\": \"#666\",\n \"tooltipAxisColor\": \"#ccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#8fd3e8\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#8fd3e8\",\n \"timelineItemColorE\": \"#8fd3e8\",\n \"timelineCheckColor\": \"#8fd3e8\",\n \"timelineCheckBorderColor\": \"rgba(138,124,168,0.37)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#8fd3e8\",\n \"timelineControlBorderColor\": \"#8fd3e8\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#8fd3e8\",\n \"datazoomBackgroundColor\": \"rgba(0,0,0,0)\",\n \"datazoomDataColor\": \"rgba(255,255,255,0.3)\",\n \"datazoomFillColor\": \"rgba(167,183,204,0.4)\",\n \"datazoomHandleColor\": \"#a7b7cc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#333\"\n }\n}\n" }, { "path": "public/themes/wonderland.json", "content": "{\n \"version\": 1,\n \"themeName\": \"wonderland\",\n \"theme\": {\n \"seriesCnt\": \"3\",\n \"backgroundColor\": \"rgba(255,255,255,0)\",\n \"titleColor\": \"#666666\",\n \"subtitleColor\": \"#999999\",\n \"textColorShow\": false,\n \"textColor\": \"#333\",\n \"markTextColor\": \"#ffffff\",\n \"color\": [\n \"#4ea397\",\n \"#22c3aa\",\n \"#7bd9a5\",\n \"#d0648a\",\n \"#f58db2\",\n \"#f2b3c9\"\n ],\n \"borderColor\": \"#ccc\",\n \"borderWidth\": 0,\n \"visualMapColor\": [\n \"#d0648a\",\n \"#22c3aa\",\n \"#adfff1\"\n ],\n \"legendTextColor\": \"#999999\",\n \"kColor\": \"#d0648a\",\n \"kColor0\": \"transparent\",\n \"kBorderColor\": \"#d0648a\",\n \"kBorderColor0\": \"#22c3aa\",\n \"kBorderWidth\": \"1\",\n \"lineWidth\": \"3\",\n \"symbolSize\": \"8\",\n \"symbol\": \"emptyCircle\",\n \"symbolBorderWidth\": \"2\",\n \"lineSmooth\": false,\n \"graphLineWidth\": \"1\",\n \"graphLineColor\": \"#cccccc\",\n \"mapLabelColor\": \"#28544e\",\n \"mapLabelColorE\": \"#349e8e\",\n \"mapBorderColor\": \"#999999\",\n \"mapBorderColorE\": \"#22c3aa\",\n \"mapBorderWidth\": 0.5,\n \"mapBorderWidthE\": 1,\n \"mapAreaColor\": \"#eeeeee\",\n \"mapAreaColorE\": \"rgba(34,195,170,0.25)\",\n \"axes\": [\n {\n \"type\": \"all\",\n \"name\": \"通用坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#cccccc\",\n \"axisTickShow\": false,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#999999\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#eeeeee\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.05)\",\n \"rgba(200,200,200,0.02)\"\n ]\n },\n {\n \"type\": \"category\",\n \"name\": \"类目坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": false,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"value\",\n \"name\": \"数值坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"log\",\n \"name\": \"对数坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n },\n {\n \"type\": \"time\",\n \"name\": \"时间坐标轴\",\n \"axisLineShow\": true,\n \"axisLineColor\": \"#333\",\n \"axisTickShow\": true,\n \"axisTickColor\": \"#333\",\n \"axisLabelShow\": true,\n \"axisLabelColor\": \"#333\",\n \"splitLineShow\": true,\n \"splitLineColor\": [\n \"#ccc\"\n ],\n \"splitAreaShow\": false,\n \"splitAreaColor\": [\n \"rgba(250,250,250,0.3)\",\n \"rgba(200,200,200,0.3)\"\n ]\n }\n ],\n \"axisSeperateSetting\": false,\n \"toolboxColor\": \"#999999\",\n \"toolboxEmphasisColor\": \"#666666\",\n \"tooltipAxisColor\": \"#cccccc\",\n \"tooltipAxisWidth\": 1,\n \"timelineLineColor\": \"#4ea397\",\n \"timelineLineWidth\": 1,\n \"timelineItemColor\": \"#4ea397\",\n \"timelineItemColorE\": \"#4ea397\",\n \"timelineCheckColor\": \"#4ea397\",\n \"timelineCheckBorderColor\": \"rgba(60,235,210,0.3)\",\n \"timelineItemBorderWidth\": 1,\n \"timelineControlColor\": \"#4ea397\",\n \"timelineControlBorderColor\": \"#4ea397\",\n \"timelineControlBorderWidth\": 0.5,\n \"timelineLabelColor\": \"#4ea397\",\n \"datazoomBackgroundColor\": \"rgba(255,255,255,0)\",\n \"datazoomDataColor\": \"rgba(222,222,222,1)\",\n \"datazoomFillColor\": \"rgba(114,230,212,0.25)\",\n \"datazoomHandleColor\": \"#cccccc\",\n \"datazoomHandleWidth\": \"100\",\n \"datazoomLabelColor\": \"#999999\"\n }\n}\n" }, { "path": "scripts/release.js", "content": "import fs from 'fs-extra';\nimport path from 'path';\nimport { fileURLToPath } from 'url';\nimport config from '../config/env.asf.js';\n\n// Get __dirname equivalent in ESM\nconst __filename = fileURLToPath(import.meta.url);\nconst __dirname = path.dirname(__filename);\n\nconst appDir = path.resolve(__dirname, '../app');\nconst releaseDestDir = config.releaseDestDir;\nconst ecWWWGeneratedDir = config.ecWWWGeneratedDir;\nconst languages = ['en', 'zh'];\n\nconsole.log('Releasing theme builder...');\n\n// Make sure directories exist\nlanguages.forEach(lang => {\n fs.ensureDirSync(path.join(ecWWWGeneratedDir, lang, 'theme-builder'));\n fs.ensureDirSync(path.join(releaseDestDir, lang, 'theme-builder'));\n});\n\n// Clean up existing JS and CSS files in the releaseDestDir\nconsole.log('Cleaning up old CSS and JS files...');\nlanguages.forEach(lang => {\n const themeBuilderDir = path.join(releaseDestDir, lang, 'theme-builder');\n if (fs.existsSync(themeBuilderDir)) {\n const files = fs.readdirSync(themeBuilderDir);\n files.forEach(file => {\n if (file.endsWith('.js') || file.endsWith('.css')) {\n const filePath = path.join(themeBuilderDir, file);\n console.log(`Removing: ${filePath}`);\n fs.removeSync(filePath);\n }\n });\n }\n});\n\n// Move app.html files to echarts-www body.html\nconsole.log('Moving app.html files to echarts-www body.html...');\nlanguages.forEach(lang => {\n fs.copySync(\n path.join(appDir, 'app.html'),\n path.join(ecWWWGeneratedDir, lang, 'theme-builder', 'body.html')\n );\n});\n\n// Move theme-builder files to website\nconsole.log('Moving theme-builder files to echarts-website...');\nlanguages.forEach(lang => {\n fs.copySync(\n path.join(appDir, 'theme-builder'),\n path.join(releaseDestDir, lang, 'theme-builder'),\n { overwrite: true }\n );\n});\n\nconsole.log('Release completed successfully!');\n" }, { "path": "src/App.vue", "content": "\n\n\n\n\n" }, { "path": "src/components/ChartPreviewPanel.vue", "content": "\n\n\n\n\n" }, { "path": "src/components/ColorList.vue", "content": "\n\n\n\n\n" }, { "path": "src/components/ColorPicker.vue", "content": "\n\n\n\n\n" }, { "path": "src/components/ThemePanel.vue", "content": "\n\n\n\n\n" }, { "path": "src/composables/useLocalization.ts", "content": "import { useI18n } from 'vue-i18n'\nimport { setLocale, getCurrentLocale, availableLocales } from '../i18n'\n\n/**\n * Localization composable\n * Provides common i18n functionality\n */\nexport function useLocalization() {\n const { t, locale } = useI18n()\n\n /**\n * Switch language\n * @param newLocale New language code\n */\n const switchLanguage = (newLocale: string) => {\n setLocale(newLocale)\n }\n\n /**\n * Get current language\n */\n const currentLanguage = getCurrentLocale()\n\n /**\n * Check if current language matches specified language\n * @param lang Language code\n */\n const isLanguage = (lang: string) => {\n return getCurrentLocale() === lang\n }\n\n /**\n * Get formatted date text\n * @param date Date object\n */\n const formatDate = (date: Date) => {\n const isZh = isLanguage('zh')\n return date.toLocaleDateString(isZh ? 'zh-CN' : 'en-US', {\n year: 'numeric',\n month: 'long',\n day: 'numeric'\n })\n }\n\n /**\n * Get formatted number text\n * @param num Number\n */\n const formatNumber = (num: number) => {\n const isZh = isLanguage('zh')\n return num.toLocaleString(isZh ? 'zh-CN' : 'en-US')\n }\n\n return {\n t,\n locale,\n switchLanguage,\n currentLanguage,\n availableLanguages: availableLocales,\n isLanguage,\n formatDate,\n formatNumber\n }\n}\n" }, { "path": "src/i18n.ts", "content": "import { createI18n } from 'vue-i18n'\nimport en from './locales/en.json'\nimport zh from './locales/zh.json'\n\n// Available languages list\nexport const availableLocales = Object.freeze([\n { code: 'en', name: 'English' },\n { code: 'zh', name: '简体中文' }\n])\n\n// Get saved language setting from localStorage, default to Chinese\nconst getStoredLanguage = (): string => {\n const stored = import.meta.env.DEV\n ? localStorage.getItem('echarts-theme-builder-locale')\n : ((window as any).EC_WWW_LANG === 'zh' ? 'zh' : 'en')\n if (stored && availableLocales.some(l => l.code === stored)) {\n return stored\n }\n // Auto-select based on browser language\n const browserLang: string = document.documentElement.lang || navigator.language || (navigator as any).browserLanguage\n return browserLang && browserLang.toLowerCase().startsWith('zh') ? 'zh' : 'en'\n}\n\nconst i18n = createI18n({\n legacy: false, // Use Composition API mode\n locale: getStoredLanguage(),\n fallbackLocale: 'en',\n messages: {\n en,\n zh\n }\n})\n\n// Save language setting to localStorage\nexport const setLocale = (locale: string) => {\n if (availableLocales.some(l => l.code === locale)) {\n i18n.global.locale.value = locale as 'en' | 'zh'\n if (import.meta.env.DEV) {\n localStorage.setItem('echarts-theme-builder-locale', locale)\n }\n }\n}\n\n// Get current language\nexport const getCurrentLocale = () => {\n return i18n.global.locale.value\n}\n\nexport default i18n\n" }, { "path": "src/locales/en.json", "content": "{\n \"common\": {\n \"add\": \"Add\",\n \"reduce\": \"Remove\",\n \"refresh\": \"Refresh\",\n \"reset\": \"Reset\",\n \"help\": \"Help\",\n \"cancel\": \"Cancel\",\n \"confirm\": \"Confirm\",\n \"ok\": \"OK\",\n \"copyCode\": \"Copy Code\",\n \"close\": \"Close\",\n \"gotIt\": \"Got it\"\n },\n \"panel\": {\n \"functions\": \"Functions\",\n \"basicConfig\": \"Basic Configuration\",\n \"visualMap\": \"Visual Map\",\n \"grid\": \"Grid (Cartesian)\",\n \"axis\": \"Axes\",\n \"legend\": \"Legend\",\n \"legendPosition\": \"Legend Position\",\n \"toolbox\": \"Toolbox\",\n \"tooltip\": \"Tooltip\",\n \"timeline\": \"Timeline\",\n \"lineChart\": \"Line Chart\",\n \"graph\": \"Graph\",\n \"map\": \"Map\",\n \"kline\": \"Candlestick Chart\",\n \"download\": \"Download\",\n \"import\": \"Import\",\n \"export\": \"Export\",\n \"themeName\": \"Name\",\n \"themePlaceholder\": \"Please enter theme name\",\n \"sourceCode\": \"Source Code\",\n \"seriesCount\": \"Series\",\n \"seriesPlaceholder\": \"Please enter series count\",\n \"preDefinedThemes\": \"Predefined Themes\",\n \"separateAxisSetting\": \"Configure different axis types separately\",\n \"extractFromImage\": \"From Image\",\n \"extractFromImageTitle\": \"Extract theme colors from an image\"\n },\n \"colors\": {\n \"background\": \"Background\",\n \"title\": \"Title\",\n \"subtitle\": \"Subtitle\",\n \"theme\": \"Theme\",\n \"markText\": \"Mark Text\",\n \"border\": \"Border\",\n \"borderWidth\": \"Border Width\",\n \"axisLine\": \"Axis Line\",\n \"axisTick\": \"Axis Tick\",\n \"splitLine\": \"Split Line\",\n \"splitArea\": \"Split Area\",\n \"axisLabel\": \"Axis Label\",\n \"legendText\": \"Legend Text\",\n \"toolbox\": \"Toolbox\",\n \"toolboxEmphasis\": \"Toolbox Hover\",\n \"visualMapColor\": \"Visual Map\"\n },\n \"position\": {\n \"left\": \"Left\",\n \"right\": \"Right\",\n \"top\": \"Top\",\n \"bottom\": \"Bottom\"\n },\n \"legend\": {\n },\n \"grid\": {\n },\n \"tooltip\": {\n \"axisPointer\": \"Axis Pointer\",\n \"axisPointerWidth\": \"Width\"\n },\n \"axis\": {\n \"categoryAxis\": \"Category Axis\",\n \"valueAxis\": \"Value Axis\",\n \"timeAxis\": \"Time Axis\",\n \"logAxis\": \"Log Axis\",\n \"all\": \"All Axes\"\n },\n \"preview\": {\n \"chartPreview\": \"Chart Preview\"\n },\n \"language\": {\n \"title\": \"Language\",\n \"en\": \"English\",\n \"zh\": \"中文\"\n },\n \"timeline\": {\n \"item\": \"Marker\",\n \"itemHover\": \"Marker Hover\",\n \"itemSelected\": \"Marker Selected\",\n \"itemSelectedBorder\": \"Selected Marker Border\",\n \"itemBorderWidth\": \"Marker Border Width\",\n \"mainAxis\": \"Main Axis\",\n \"mainAxisWidth\": \"Main Axis Width\",\n \"controlFill\": \"Control Fill\",\n \"controlBorder\": \"Control Border\",\n \"controlBorderWidth\": \"Control Border Width\",\n \"label\": \"Label\"\n },\n \"lineChart\": {\n \"smooth\": \"Smooth Curve\",\n \"lineWidth\": \"Line Width\",\n \"symbolBorder\": \"Symbol Border\",\n \"symbolSize\": \"Symbol Size\",\n \"symbolShape\": \"Symbol Shape\",\n \"circle\": \"Circle\",\n \"emptyCircle\": \"Empty Circle\",\n \"rect\": \"Rectangle\",\n \"emptyRect\": \"Empty Rectangle\",\n \"roundRect\": \"Rounded Rectangle\",\n \"emptyRoundRect\": \"Empty Rounded Rectangle\",\n \"triangle\": \"Triangle\",\n \"emptyTriangle\": \"Empty Triangle\",\n \"diamond\": \"Diamond\",\n \"emptyDiamond\": \"Empty Diamond\",\n \"pin\": \"Pin\",\n \"emptyPin\": \"Empty Pin\",\n \"arrow\": \"Arrow\",\n \"emptyArrow\": \"Empty Arrow\"\n },\n \"graph\": {\n \"lineWidth\": \"Line Width\",\n \"lineColor\": \"Line Color\"\n },\n \"map\": {\n \"areaColor\": \"Area Color\",\n \"borderColor\": \"Border Color\",\n \"borderWidth\": \"Border Width\",\n \"labelColor\": \"Label Color\",\n \"areaHoverColor\": \"Area Hover Color\",\n \"borderHoverColor\": \"Border Hover Color\",\n \"borderHoverWidth\": \"Border Hover Width\",\n \"labelHoverColor\": \"Label Hover Color\"\n },\n \"kline\": {\n \"upColor\": \"Up Color\",\n \"downColor\": \"Down Color\",\n \"upBorderColor\": \"Up Border Color\",\n \"downBorderColor\": \"Down Border Color\",\n \"borderWidth\": \"Border Width\"\n },\n \"modals\": {\n \"themeCodeTitle\": \"Theme Code\",\n \"importThemeTitle\": \"Import Theme\",\n \"helpTitle\": \"Help\",\n \"helpContent\": {\n \"whatIs\": \"What is the Theme Builder?\",\n \"whatIsDesc1\": \"A \\\"theme\\\" is a style abstraction for ECharts charts, used to unify the style of multiple charts. Using the online theme builder, you can quickly and intuitively generate theme configuration files and use customized theme styles in ECharts.\",\n \"whatIsDesc2\": \"Based on this theme, you can still use setOption to override or set theme styles.\",\n \"whatIsDesc3\": \"ECharts officially provides themes such as default, infographic, shine, roma, macarons, vintage, etc., which can be downloaded for use.\",\n \"importExport\": \"Import and Export\",\n \"importExportDesc\": \"For convenient secondary modifications, our theme builder supports importing and exporting configuration items. The exported JSON file is only used for importing in this tool and cannot be directly registered as a theme in ECharts.\"\n },\n \"formatSelection\": \"Select Format\",\n \"formatSelectionMsg\": \"Please select a format for the theme file:\",\n \"jsFormat\": \"JavaScript File\",\n \"jsonFormat\": \"JSON File\",\n \"jsUsageTitle\": \"JavaScript Theme File Usage\",\n \"jsonUsageTitle\": \"JSON Theme File Usage\",\n \"jsUsageStep1\": \"Save the downloaded __filename__ file to your project\",\n \"jsonUsageStep1\": \"Save the downloaded __filename__ file to your project\",\n \"jsUsageStep2\": \"Include this file in your HTML:\",\n \"jsonUsageStep2\": \"Read and parse the JSON file:\",\n \"jsUsageStep3\": \"Use the theme when creating a chart:\",\n \"jsonUsageStep3\": \"Register the theme:\",\n \"jsonUsageStep4\": \"Use the theme when creating a chart:\",\n \"jsUsageTip\": \"💡 The second parameter is the theme name registered in the JS file.\",\n \"jsonUsageTip\": \"💡 The second parameter is the theme name used during registration.\",\n \"downloadFailed\": \"Download failed, please try again\",\n \"exportSuccess\": \"Configuration exported successfully!\",\n \"exportFailed\": \"Export failed, please try again\",\n \"chartsRefreshed\": \"Charts refreshed\",\n \"resetConfirm\": \"Are you sure you want to reset to the default theme? This action cannot be undone.\",\n \"themeReset\": \"Theme has been reset\",\n \"selectCodeFormat\": \"Select code format to view:\",\n \"codeGenFailed\": \"Code generation failed\",\n \"codeCopied\": \"Code copied to clipboard\",\n \"copyFailed\": \"Copy failed, please copy manually\",\n \"selectJsonFile\": \"Please select a JSON format configuration file!\",\n \"useExportedFile\": \"Please use a JSON configuration file exported from this site!\",\n \"oldVersionPrompt\": \"The imported theme is from an older version, some properties may not be correctly set. Continue importing?\",\n \"importSuccess\": \"Theme imported successfully!\",\n \"invalidFormat\": \"Configuration file format error, please use a JSON file exported from this site!\",\n \"fileReadFailed\": \"File read failed, please try again\",\n \"extractingColors\": \"Please wait when extracting colors from image...\",\n \"extractColorFailed\": \"Failed to extract colors from image\"\n }\n}\n" }, { "path": "src/locales/zh.json", "content": "{\n \"common\": {\n \"add\": \"增加\",\n \"reduce\": \"减少\",\n \"refresh\": \"刷新\",\n \"reset\": \"复原\",\n \"help\": \"帮助\",\n \"cancel\": \"取消\",\n \"confirm\": \"确定\",\n \"ok\": \"好的\",\n \"copyCode\": \"复制代码\",\n \"close\": \"关闭\",\n \"gotIt\": \"知道了\"\n },\n \"panel\": {\n \"functions\": \"功能\",\n \"basicConfig\": \"基本配置\",\n \"visualMap\": \"视觉映射\",\n \"grid\": \"Grid 布局\",\n \"axis\": \"坐标轴\",\n \"legend\": \"图例\",\n \"legendPosition\": \"图例位置\",\n \"toolbox\": \"工具箱\",\n \"tooltip\": \"提示框\",\n \"timeline\": \"时间轴\",\n \"lineChart\": \"折线图\",\n \"graph\": \"关系图\",\n \"map\": \"地图\",\n \"kline\": \"K线图\",\n \"download\": \"下载主题\",\n \"import\": \"导入配置\",\n \"export\": \"导出配置\",\n \"themeName\": \"主题名称\",\n \"themePlaceholder\": \"请输入主题名称\",\n \"sourceCode\": \"项目源码\",\n \"seriesCount\": \"系列数量\",\n \"seriesPlaceholder\": \"请输入系列数量\",\n \"preDefinedThemes\": \"默认方案\",\n \"separateAxisSetting\": \"为不同类型坐标轴分别设置\",\n \"extractFromImage\": \"从图片提取\",\n \"extractFromImageTitle\": \"上传一张图片并从中提取颜色\"\n },\n \"colors\": {\n \"background\": \"背景\",\n \"title\": \"标题\",\n \"subtitle\": \"副标题\",\n \"theme\": \"主题\",\n \"markText\": \"标签文字\",\n \"border\": \"描边\",\n \"borderWidth\": \"描边粗细\",\n \"axisLine\": \"轴线\",\n \"axisTick\": \"刻度\",\n \"splitLine\": \"网格\",\n \"splitArea\": \"填充\",\n \"axisLabel\": \"文字\",\n \"legendText\": \"文字\",\n \"toolbox\": \"图标\",\n \"toolboxEmphasis\": \"悬停\",\n \"visualMapColor\": \"视觉映射\"\n },\n \"position\": {\n \"left\": \"左\",\n \"right\": \"右\",\n \"top\": \"上\",\n \"bottom\": \"下\"\n },\n \"legend\": {\n },\n \"grid\": {\n },\n \"tooltip\": {\n \"axisPointer\": \"指示线\",\n \"axisPointerWidth\": \"宽度\"\n },\n \"axis\": {\n \"categoryAxis\": \"类目轴\",\n \"valueAxis\": \"数值轴\",\n \"timeAxis\": \"时间轴\",\n \"logAxis\": \"对数轴\",\n \"all\": \"所有坐标轴\"\n },\n \"preview\": {\n \"chartPreview\": \"图表预览\"\n },\n \"language\": {\n \"title\": \"语言\",\n \"en\": \"English\",\n \"zh\": \"中文\"\n },\n \"timeline\": {\n \"item\": \"标记\",\n \"itemHover\": \"标记悬停\",\n \"itemSelected\": \"标记选中\",\n \"itemSelectedBorder\": \"标记选中描边\",\n \"itemBorderWidth\": \"标记描边\",\n \"mainAxis\": \"主轴\",\n \"mainAxisWidth\": \"主轴宽度\",\n \"controlFill\": \"控件填充\",\n \"controlBorder\": \"控件描边\",\n \"controlBorderWidth\": \"控件描边宽度\",\n \"label\": \"文字\"\n },\n \"lineChart\": {\n \"smooth\": \"平滑曲线\",\n \"lineWidth\": \"线条宽度\",\n \"symbolBorder\": \"图形描边\",\n \"symbolSize\": \"图形大小\",\n \"symbolShape\": \"图形形状\",\n \"circle\": \"圆形\",\n \"emptyCircle\": \"空心圆形\",\n \"rect\": \"方形\",\n \"emptyRect\": \"空心方形\",\n \"roundRect\": \"圆角矩形\",\n \"emptyRoundRect\": \"空心圆角矩形\",\n \"triangle\": \"三角形\",\n \"emptyTriangle\": \"空心三角形\",\n \"diamond\": \"菱形\",\n \"emptyDiamond\": \"空心菱形\",\n \"pin\": \"水滴\",\n \"emptyPin\": \"空心水滴\",\n \"arrow\": \"箭头\",\n \"emptyArrow\": \"空心箭头\"\n },\n \"graph\": {\n \"lineWidth\": \"线条宽度\",\n \"lineColor\": \"线条颜色\"\n },\n \"map\": {\n \"areaColor\": \"区域颜色\",\n \"borderColor\": \"边界颜色\",\n \"borderWidth\": \"边界宽度\",\n \"labelColor\": \"标签颜色\",\n \"areaHoverColor\": \"悬停区域颜色\",\n \"borderHoverColor\": \"悬停边界颜色\",\n \"borderHoverWidth\": \"悬停边界宽度\",\n \"labelHoverColor\": \"悬停标签颜色\"\n },\n \"kline\": {\n \"upColor\": \"阳线颜色\",\n \"downColor\": \"阴线颜色\",\n \"upBorderColor\": \"阳线边框\",\n \"downBorderColor\": \"阴线边框\",\n \"borderWidth\": \"边框宽度\"\n },\n \"modals\": {\n \"themeCodeTitle\": \"主题代码\",\n \"importThemeTitle\": \"导入主题\",\n \"helpTitle\": \"帮助\",\n \"helpContent\": {\n \"whatIs\": \"主题在线构建工具是什么？\",\n \"whatIsDesc1\": \"\\\"主题\\\"是 ECharts 图表的风格抽象，用于统一多个图表的风格样式。使用主题在线构建工具，可以快速直观地生成主题配置文件，并在 ECharts 中使用自定义的主题样式。\",\n \"whatIsDesc2\": \"在此主题的基础上，你仍然可以使用 setOption 覆盖或设置主题样式。\",\n \"whatIsDesc3\": \"ECharts 官方提供 default、infographic、shine、roma、macarons、vintage 等主题，可供下载使用。\",\n \"importExport\": \"导入、导出\",\n \"importExportDesc\": \"为了便于二次修改，我们的主题构建工具支持导入、导出配置项，导出的 JSON 文件仅用于在本工具中导入使用，而不能直接作为主题在 ECharts 中注册。\"\n },\n \"formatSelection\": \"选择下载格式\",\n \"formatSelectionMsg\": \"请选择要下载的主题文件格式：\",\n \"jsFormat\": \"JavaScript 文件\",\n \"jsonFormat\": \"JSON 文件\",\n \"jsUsageTitle\": \"JavaScript 主题文件使用方法\",\n \"jsonUsageTitle\": \"JSON 主题文件使用方法\",\n \"jsUsageStep1\": \"将下载的 __filename__ 文件保存到项目中\",\n \"jsonUsageStep1\": \"将下载的 __filename__ 文件保存到项目中\",\n \"jsUsageStep2\": \"在 HTML 中引入此文件：\",\n \"jsonUsageStep2\": \"读取 JSON 文件并解析：\",\n \"jsUsageStep3\": \"创建图表时使用主题：\",\n \"jsonUsageStep3\": \"注册主题：\",\n \"jsonUsageStep4\": \"创建图表时使用主题：\",\n \"jsUsageTip\": \"💡 第二个参数是在 JS 文件中注册的主题名称。\",\n \"jsonUsageTip\": \"💡 第二个参数是注册时使用的主题名称。\",\n \"downloadFailed\": \"下载失败，请重试\",\n \"exportSuccess\": \"配置导出成功！\",\n \"exportFailed\": \"导出失败，请重试\",\n \"chartsRefreshed\": \"图表已刷新\",\n \"resetConfirm\": \"确定要重置为默认主题吗？此操作不可撤销。\",\n \"themeReset\": \"主题已重置\",\n \"selectCodeFormat\": \"选择要查看的代码格式：\",\n \"codeGenFailed\": \"代码生成失败\",\n \"codeCopied\": \"代码已复制到剪贴板\",\n \"copyFailed\": \"复制失败，请手动复制\",\n \"selectJsonFile\": \"请选择 JSON 格式的配置文件！\",\n \"useExportedFile\": \"请使用从本网站导出的 JSON 配置文件！\",\n \"oldVersionPrompt\": \"导入的主题版本较低，某些属性可能无法正确设置。是否继续导入？\",\n \"importSuccess\": \"主题导入成功！\",\n \"invalidFormat\": \"配置文件格式错误，请使用从本网站导出的 JSON 文件！\",\n \"fileReadFailed\": \"文件读取失败，请重试\",\n \"extractingColors\": \"正在从图片中提取颜色...\",\n \"extractColorFailed\": \"从图片提取颜色失败\"\n }\n}\n" }, { "path": "src/main.ts", "content": "import 'vant/lib/index.css'\nimport './style.css'\nimport { createApp } from 'vue'\nimport {\n Col,\n Row,\n Collapse,\n CollapseItem,\n Field,\n Button,\n Icon,\n Checkbox,\n RadioGroup,\n Radio\n} from 'vant'\nimport App from './App.vue'\nimport i18n from './i18n'\n\nconst app = createApp(App)\napp.use(i18n)\napp.use(Col)\napp.use(Row)\napp.use(Collapse)\napp.use(CollapseItem)\napp.use(Field)\napp.use(Button)\napp.use(Icon)\napp.use(Checkbox)\napp.use(RadioGroup)\napp.use(Radio)\napp.mount('#theme-builder-app')\n" }, { "path": "src/stores/theme.ts", "content": "import { ref, reactive, markRaw } from 'vue'\nimport type { ThemeData, PreDefinedTheme } from '../types/theme'\nimport { generateEChartsTheme, generateThemeJsFile, generateThemeConfigForDownload } from '../utils/themeGenerator'\n\n// Predefined themes configuration\nexport const PRE_DEFINED_THEMES: PreDefinedTheme[] = markRaw([\n {\n name: 'v5',\n background: 'rgba(0, 0, 0, 0)',\n theme: [\n '#5470c6',\n '#91cc75',\n '#fac858',\n '#ee6666',\n '#73c0de',\n '#3ba272',\n '#fc8452',\n '#9a60b4',\n '#ea7ccc'\n ]\n },\n {\n name: 'vintage',\n background: '#fef8ef',\n theme: [\n '#d87c7c', '#919e8b', '#d7ab82', '#6e7074', '#61a0a8',\n '#efa18d', '#787464', '#cc7e63', '#724e58', '#4b565b'\n ]\n },\n {\n name: 'dark',\n background: '#333',\n theme: [\n '#dd6b66', '#759aa0', '#e69d87', '#8dc1a9', '#ea7e53',\n '#eedd78', '#73a373', '#73b9bc', '#7289ab', '#91ca8c',\n '#f49f42'\n ]\n },\n {\n name: 'westeros',\n background: 'transparent',\n theme: [\n '#516b91', '#59c4e6', '#edafda', '#93b7e3', '#a5e7f0',\n '#cbb0e3'\n ]\n },\n {\n name: 'essos',\n background: 'rgba(242,234,191,0.15)',\n theme: [\n '#893448', '#d95850', '#eb8146', '#ffb248', '#f2d643',\n '#ebdba4'\n ]\n },\n {\n name: 'wonderland',\n background: 'transparent',\n theme: [\n '#4ea397', '#22c3aa', '#7bd9a5', '#d0648a', '#f58db2',\n '#f2b3c9'\n ]\n },\n {\n name: 'walden',\n background: 'rgba(252,252,252,0)',\n theme: [\n '#3fb1e3', '#6be6c1', '#626c91', '#a0a7e6', '#c4ebad',\n '#96dee8'\n ]\n },\n {\n name: 'chalk',\n background: '#293441',\n theme: [\n '#fc97af', '#87f7cf', '#f7f494', '#72ccff', '#f7c5a0',\n '#d4a4eb', '#d2f5a6', '#76f2f2'\n ]\n },\n {\n name: 'infographic',\n background: 'transparent',\n theme: [\n '#C1232B', '#27727B', '#FCCE10', '#E87C25', '#B5C334',\n '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD',\n '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'\n ]\n },\n {\n name: 'macarons',\n background: 'transparent',\n theme: [\n '#2ec7c9', '#b6a2de', '#5ab1ef', '#ffb980', '#d87a80',\n '#8d98b3', '#e5cf0d', '#97b552', '#95706d', '#dc69aa',\n '#07a2a4', '#9a7fd1', '#588dd5', '#f5994e', '#c05050',\n '#59678c', '#c9ab00', '#7eb00a', '#6f5553', '#c14089'\n ]\n },\n {\n name: 'roma',\n background: 'transparent',\n theme: [\n '#E01F54', '#001852', '#f5e8c8', '#b8d2c7', '#c6b38e',\n '#a4d8c2', '#f3d999', '#d3758f', '#dcc392', '#2e4783',\n '#82b6e9', '#ff6347', '#a092f1', '#0a915d', '#eaf889',\n '#6699FF', '#ff6666', '#3cb371', '#d5b158', '#38b6b6'\n ]\n },\n {\n name: 'shine',\n background: 'transparent',\n theme: [\n '#c12e34', '#e6b600', '#0098d9', '#2b821d', '#005eaa',\n '#339ca8', '#cda819', '#32a487'\n ]\n },\n {\n name: 'purple-passion',\n background: 'rgba(91,92,110,1)',\n theme: [\n '#8a7ca8', '#e098c7', '#8fd3e8', '#71669e', '#cc70af',\n '#7cb4cc'\n ]\n }\n])\n\n// Default theme axes configuration\nconst createDefaultAxes = () => {\n const types = ['all', 'category', 'value', 'log', 'time']\n const names = ['General', 'Category', 'Value', 'Log', 'Time']\n return types.map((type, i) => ({\n type,\n name: names[i] + ' Axis',\n axisLineShow: type !== 'value' && type !== 'log',\n axisLineColor: '#54555a',\n axisTickShow: type !== 'value' && type !== 'log',\n axisTickColor: '#54555a',\n axisLabelShow: true,\n axisLabelColor: '#54555a',\n splitLineShow: type !== 'category' && type !== 'time',\n splitLineColor: ['#dbdee4'],\n splitAreaShow: false,\n splitAreaColor: ['rgba(234,237,245,0.5)', 'rgba(255,255,255,0)']\n }))\n}\n\nexport const createDefaultTheme = (): ThemeData => {\n const axes = createDefaultAxes()\n return {\n seriesCnt: 3,\n backgroundColor: 'rgba(0, 0, 0, 0)',\n titleColor: '#464646',\n subtitleColor: '#6E7079',\n textColorShow: false,\n textColor: '#333',\n markTextColor: '#eee',\n color: [\n '#5070dd',\n '#b6d634',\n '#505372',\n '#ff994d',\n '#0ca8df',\n '#ffd10a',\n '#fb628b',\n '#785db0',\n '#3fbe95'\n ],\n borderColor: '#ccc',\n borderWidth: 0,\n visualMapColor: ['#bf444c', '#d88273', '#f6efa6'],\n legendTextColor: '#333',\n kColor: '#eb5454',\n kColor0: '#47b262',\n kBorderColor: '#eb5454',\n kBorderColor0: '#47b262',\n kBorderWidth: 1,\n lineWidth: 2,\n symbolSize: 4,\n symbol: 'emptyCircle',\n symbolBorderWidth: 1,\n lineSmooth: false,\n graphLineWidth: 1,\n graphLineColor: '#aaa',\n mapLabelColor: '#000',\n mapLabelColorE: 'rgb(100,0,0)',\n mapBorderColor: '#444',\n mapBorderColorE: '#444',\n mapBorderWidth: 0.5,\n mapBorderWidthE: 1,\n mapAreaColor: '#eee',\n mapAreaColorE: 'rgba(255,215,0,0.8)',\n axes,\n axisSeperateSetting: true,\n axis: [axes[0]!],\n toolboxColor: '#999',\n toolboxEmphasisColor: '#666',\n tooltipAxisColor: '#ccc',\n tooltipAxisWidth: 1,\n timelineLineColor: '#DAE1F5',\n timelineLineWidth: 2,\n timelineItemColor: '#A4B1D7',\n timelineItemColorE: '#FFF',\n timelineCheckColor: '#316bf3',\n timelineCheckBorderColor: '#fff',\n timelineItemBorderWidth: 1,\n timelineControlColor: '#A4B1D7',\n timelineControlBorderColor: '#A4B1D7',\n timelineControlBorderWidth: 1,\n timelineLabelColor: '#A4B1D7',\n gridLeft: '15%',\n gridRight: '10%',\n gridTop: 65,\n gridBottom: 80,\n legendLeft: 'center',\n legendRight: 'auto',\n legendTop: 'auto',\n legendBottom: 15\n }\n}\n\n// Global state management - Singleton pattern\nlet themeStoreInstance: ReturnType | null = null\n\nconst createThemeStore = () => {\n const theme = reactive(createDefaultTheme())\n const themeName = ref('customized')\n const chartDisplay = reactive({\n background: '#fff',\n title: '#000'\n })\n\n const resetTheme = () => {\n activePreDefinedThemeIndex.value = null\n Object.assign(theme, createDefaultTheme())\n themeName.value = 'customized'\n }\n\n const activePreDefinedThemeIndex = ref(null)\n let definedThemeLoadAbortController: AbortController | null = null\n const loadPreDefinedTheme = async (index: number) => {\n if (activePreDefinedThemeIndex.value === index) {\n return\n }\n\n activePreDefinedThemeIndex.value = index\n\n definedThemeLoadAbortController?.abort()\n definedThemeLoadAbortController = new AbortController()\n\n const preTheme = PRE_DEFINED_THEMES[index]\n if (!preTheme) {\n console.error('No theme found at index:', index)\n return\n }\n\n try {\n // Load the complete theme configuration from JSON file\n const response = await fetch(`${import.meta.env.VITE_APP_ASSETS_DIR}themes/${preTheme.name}.json`, {\n signal: definedThemeLoadAbortController.signal\n })\n if (!response.ok) {\n throw new Error(`Failed to load theme: ${preTheme.name}`)\n }\n\n const themeData = await response.json()\n\n if (themeData.theme) {\n // Convert string numbers to actual numbers\n const loadedTheme = { ...themeData.theme }\n\n // Apply the complete theme configuration property by property to ensure reactivity\n // This ensures Vue's reactive system properly detects changes\n Object.keys(loadedTheme).forEach(key => {\n if (key in theme) {\n (theme as any)[key] = loadedTheme[key]\n }\n })\n\n themeName.value = themeData.themeName || preTheme.name\n\n // Ensure color is an array\n if (typeof theme.color === 'string') {\n theme.color = [theme.color]\n }\n\n // Update axis settings based on axisSeperateSetting\n updateAxisSetting()\n }\n } catch (error) {\n console.error('Error loading predefined theme:', error)\n // Fallback to basic theme loading\n theme.backgroundColor = preTheme.background\n theme.color = [...preTheme.theme]\n themeName.value = preTheme.name\n }\n }\n\n const updateAxisSetting = () => {\n if (theme.axisSeperateSetting) {\n theme.axis = theme.axes\n } else {\n theme.axis = [theme.axes[0]!]\n }\n }\n\n const importTheme = (jsonString: string) => {\n try {\n const data = JSON.parse(jsonString)\n if (data.theme) {\n Object.assign(theme, data.theme)\n if (data.themeName) {\n themeName.value = data.themeName\n }\n updateAxisSetting()\n }\n } catch (error) {\n console.error('Failed to import theme:', error)\n throw error\n }\n }\n\n const exportTheme = () => {\n const exportData = { ...theme }\n // Remove duplicate axis options since they are already included in theme.axes\n const { axis, ...cleanedData } = exportData\n return cleanedData\n }\n\n const getEChartsTheme = () => {\n // Convert reactive object to plain object to ensure proper data passing\n const plainTheme = JSON.parse(JSON.stringify(theme))\n return generateEChartsTheme(plainTheme)\n }\n\n const getThemeJsFile = () => {\n return generateThemeJsFile(theme, themeName.value)\n }\n\n const getThemeConfigForDownload = () => {\n return generateThemeConfigForDownload(theme, themeName.value, 1)\n }\n\n return {\n theme,\n themeName,\n chartDisplay,\n resetTheme,\n activePreDefinedThemeIndex,\n loadPreDefinedTheme,\n updateAxisSetting,\n importTheme,\n exportTheme,\n getEChartsTheme,\n getThemeJsFile,\n getThemeConfigForDownload\n }\n}\n\nexport const useThemeStore = () => {\n if (!themeStoreInstance) {\n themeStoreInstance = createThemeStore()\n }\n return themeStoreInstance\n}\n" }, { "path": "src/style.css", "content": "#theme-builder-app {\n height: 100%;\n overflow: auto;\n}\n\n:root, :host {\n --van-primary-color: #ff6d8f;\n /* inherit font from parent page */\n --van-base-font: inherit;\n}\n" }, { "path": "src/types/theme.ts", "content": "// ECharts theme type definitions\nexport interface ThemeAxis {\n type: string\n name: string\n axisLineShow: boolean\n axisLineColor: string\n axisTickShow: boolean\n axisTickColor: string\n axisLabelShow: boolean\n axisLabelColor: string\n splitLineShow: boolean\n splitLineColor: string[]\n splitAreaShow: boolean\n splitAreaColor: string[]\n}\n\nexport interface ThemeData {\n // Basic configuration\n seriesCnt: number\n backgroundColor: string\n titleColor: string\n subtitleColor: string\n textColorShow: boolean\n textColor: string\n markTextColor: string\n\n // Main color palette\n color: string[]\n\n // Border\n borderColor: string\n borderWidth: number\n\n // Visual mapping\n visualMapColor: string[]\n\n // Legend\n legendTextColor: string\n\n // Candlestick chart\n kColor: string\n kColor0: string\n kBorderColor: string\n kBorderColor0: string\n kBorderWidth: number\n\n // Line chart\n lineWidth: number\n symbolSize: number\n symbol: string\n symbolBorderWidth: number\n lineSmooth: boolean\n\n // Graph/Network chart\n graphLineWidth: number\n graphLineColor: string\n\n // Map\n mapLabelColor: string\n mapLabelColorE: string\n mapBorderColor: string\n mapBorderColorE: string\n mapBorderWidth: number\n mapBorderWidthE: number\n mapAreaColor: string\n mapAreaColorE: string\n\n // Coordinate axis\n axes: ThemeAxis[]\n axisSeperateSetting: boolean\n axis: ThemeAxis[] | null\n\n // Toolbox\n toolboxColor: string\n toolboxEmphasisColor: string\n\n // Tooltip\n tooltipAxisColor: string\n tooltipAxisWidth: number\n\n // Timeline\n timelineLineColor: string\n timelineLineWidth: number\n timelineItemColor: string\n timelineItemColorE: string\n timelineCheckColor: string\n timelineCheckBorderColor: string\n timelineItemBorderWidth: number\n timelineControlColor: string\n timelineControlBorderColor: string\n timelineControlBorderWidth: number\n timelineLabelColor: string\n\n // Grid layout\n gridLeft: number | string\n gridRight: number | string\n gridTop: number | string\n gridBottom: number | string\n\n // Legend position\n legendLeft: number | string\n legendRight: number | string\n legendTop: number | string\n legendBottom: number | string\n}\n\nexport interface PreDefinedTheme {\n name: string\n background: string\n theme: string[]\n}\n\nexport interface ChartDisplay {\n background: string\n title: string\n}\n" }, { "path": "src/utils/chartConfigs.ts", "content": "import type { EChartsOption } from 'echarts'\n\n// Chart configuration interface\ninterface ChartConfig {\n title: string\n subtitle?: string\n type: string\n option: EChartsOption\n}\n\n// Generate random data helper functions\nfunction getRandomValue(max: number = 1000, min: number = 100): number {\n return Math.floor(Math.random() * (max - min) + min)\n}\n\nfunction getRandomArray(length: number, max: number = 1000, min: number = 100): number[] {\n return Array.from({ length }, () => getRandomValue(max, min))\n}\n\n// Chart configurations\nexport function getChartConfigs(seriesCnt: number = 4): ChartConfig[] {\n const axisCat = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n const legendData = Array.from({ length: seriesCnt }, (_, i) => `Series ${i + 1}`)\n\n const commonTooltip = {\n trigger: 'axis' as const\n }\n\n const commonToolbox = {\n feature: {\n restore: { show: true },\n saveAsImage: { show: true },\n dataView: { show: true },\n dataZoom: { show: true }\n }\n }\n\n const configs: ChartConfig[] = [\n // Line Chart\n {\n title: 'Line Chart',\n subtitle: 'Basic line chart example',\n type: 'line',\n option: {\n title: {\n text: 'Line Chart',\n subtext: 'Basic line chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: commonTooltip,\n toolbox: commonToolbox,\n xAxis: {\n type: 'category',\n data: axisCat\n },\n yAxis: {\n type: 'value'\n },\n series: legendData.map(name => ({\n name,\n type: 'line' as const,\n data: getRandomArray(axisCat.length, 800, 200),\n markPoint: {\n data: [{ name: 'Min', type: 'min' }]\n }\n }))\n }\n },\n\n // Stacked Area Chart\n {\n title: 'Stacked Area Chart',\n subtitle: 'Stacked area chart example',\n type: 'area',\n option: {\n title: {\n text: 'Stacked Area Chart',\n subtext: 'Stacked area chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: commonTooltip,\n toolbox: commonToolbox,\n xAxis: {\n type: 'category',\n data: axisCat,\n boundaryGap: false\n },\n yAxis: {\n type: 'value'\n },\n series: legendData.map(name => ({\n name,\n type: 'line' as const,\n data: getRandomArray(axisCat.length, 800, 200),\n areaStyle: {},\n stack: 'total'\n }))\n }\n },\n\n // Bar Chart\n {\n title: 'Bar Chart',\n subtitle: 'Basic bar chart example',\n type: 'bar',\n option: {\n title: {\n text: 'Bar Chart',\n subtext: 'Basic bar chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: commonTooltip,\n toolbox: commonToolbox,\n xAxis: {\n type: 'category',\n data: axisCat\n },\n yAxis: {\n type: 'value'\n },\n series: legendData.map(name => ({\n name,\n type: 'bar' as const,\n data: getRandomArray(axisCat.length, 800, 200),\n markPoint: {\n data: [{ name: 'Min', type: 'min' }]\n }\n }))\n }\n },\n\n // Stacked Bar Chart\n {\n title: 'Stacked Bar Chart',\n subtitle: 'Stacked bar chart example',\n type: 'stackedBar',\n option: {\n title: {\n text: 'Stacked Bar Chart',\n subtext: 'Stacked bar chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: commonTooltip,\n toolbox: commonToolbox,\n xAxis: {\n type: 'category',\n data: axisCat\n },\n yAxis: {\n type: 'value'\n },\n series: legendData.map(name => ({\n name,\n type: 'bar' as const,\n data: getRandomArray(axisCat.length, 800, 200),\n stack: 'total'\n }))\n }\n },\n\n // Scatter Chart\n {\n title: 'Scatter Chart',\n subtitle: 'Basic scatter chart example',\n type: 'scatter',\n option: {\n title: {\n text: 'Scatter Chart',\n subtext: 'Basic scatter chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: {\n trigger: 'item' as const\n },\n toolbox: commonToolbox,\n xAxis: {\n type: 'value'\n },\n yAxis: {\n type: 'value'\n },\n series: legendData.map(name => ({\n name,\n type: 'scatter' as const,\n data: Array.from({ length: 32 }, () => [\n getRandomValue(600, 100),\n getRandomValue(600, 100)\n ])\n }))\n }\n },\n\n // Pie Chart\n {\n title: 'Pie Chart',\n subtitle: 'Basic pie chart example',\n type: 'pie',\n option: {\n title: {\n text: 'Pie Chart',\n subtext: 'Basic pie chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: {\n trigger: 'item',\n formatter: '{a}
{b}: {c} ({d}%)'\n },\n toolbox: commonToolbox,\n series: [{\n name: 'Data',\n type: 'pie' as const,\n radius: '50%',\n data: legendData.map(name => ({\n name,\n value: getRandomValue(800, 200)\n })),\n emphasis: {\n itemStyle: {\n shadowBlur: 10,\n shadowOffsetX: 0,\n shadowColor: 'rgba(0, 0, 0, 0.5)'\n }\n }\n }]\n }\n },\n\n // Radar Chart\n {\n title: 'Radar Chart',\n subtitle: 'Basic radar chart example',\n type: 'radar',\n option: {\n title: {\n text: 'Radar Chart',\n subtext: 'Basic radar chart example'\n },\n legend: {\n data: legendData\n },\n tooltip: commonTooltip,\n toolbox: commonToolbox,\n radar: {\n indicator: axisCat.map(name => ({ name, max: 1000 })),\n center: ['50%', '60%']\n },\n series: legendData.map(name => ({\n name,\n type: 'radar' as const,\n data: [{\n value: getRandomArray(axisCat.length, 800, 200),\n name\n }]\n }))\n }\n },\n\n // Candlestick Chart (K-Line)\n {\n title: 'Candlestick Chart',\n subtitle: 'K-line chart with data zoom',\n type: 'candlestick',\n option: {\n title: {\n text: 'Candlestick Chart',\n subtext: 'K-line chart with data zoom'\n },\n tooltip: {\n trigger: 'axis' as const\n },\n toolbox: {\n show: true,\n feature: {\n dataZoom: { show: true },\n dataView: { show: true },\n restore: { show: true }\n }\n },\n dataZoom: {\n show: true,\n realtime: true,\n start: 50,\n end: 100\n },\n xAxis: {\n type: 'category',\n data: Array.from({ length: 20 }, (_, i) => `Day ${i + 1}`)\n },\n yAxis: {\n type: 'value',\n scale: true\n },\n series: [{\n name: 'Stock Price',\n type: 'candlestick' as const,\n data: Array.from({ length: 20 }, () => {\n const open = getRandomValue(2400, 2200)\n const close = getRandomValue(2400, 2200)\n const low = Math.min(open, close) - getRandomValue(50, 0)\n const high = Math.max(open, close) + getRandomValue(50, 0)\n return [open, close, low, high]\n })\n }]\n }\n },\n\n // Heatmap\n {\n title: 'Heatmap',\n subtitle: 'Basic heatmap example',\n type: 'heatmap',\n option: {\n title: {\n text: 'Heatmap',\n subtext: 'Basic heatmap example'\n },\n tooltip: {\n trigger: 'item' as const\n },\n toolbox: commonToolbox,\n xAxis: {\n type: 'category',\n data: ['12a', '1a', '2a', '3a', '4a', '5a', '6a', '7a', '8a', '9a', '10a', '11a']\n },\n yAxis: {\n type: 'category',\n data: ['Sat', 'Fri', 'Thu', 'Wed', 'Tue', 'Mon', 'Sun']\n },\n visualMap: {\n min: 1,\n max: 10,\n calculable: true\n },\n series: [{\n name: 'Heat',\n type: 'heatmap' as const,\n data: Array.from({ length: 84 }, (_, i) => {\n const x = i % 12\n const y = Math.floor(i / 12)\n return [x, y, getRandomValue(10, 1)]\n }),\n label: {\n show: true\n }\n }]\n }\n },\n\n // Treemap\n {\n title: 'Treemap',\n subtitle: 'Basic treemap example',\n type: 'treemap',\n option: {\n title: {\n text: 'Treemap',\n subtext: 'Basic treemap example'\n },\n tooltip: {\n trigger: 'item' as const,\n formatter: '{b}: {c}'\n },\n toolbox: commonToolbox,\n series: [{\n type: 'treemap' as const,\n data: [\n {\n name: 'Category A',\n value: getRandomValue(1000, 500),\n children: [\n { name: 'A1', value: getRandomValue(300, 100) },\n { name: 'A2', value: getRandomValue(300, 100) },\n { name: 'A3', value: getRandomValue(300, 100) }\n ]\n },\n {\n name: 'Category B',\n value: getRandomValue(1000, 500),\n children: [\n { name: 'B1', value: getRandomValue(300, 100) },\n { name: 'B2', value: getRandomValue(300, 100) }\n ]\n },\n {\n name: 'Category C',\n value: getRandomValue(1000, 500),\n children: [\n { name: 'C1', value: getRandomValue(300, 100) },\n { name: 'C2', value: getRandomValue(300, 100) },\n { name: 'C3', value: getRandomValue(300, 100) },\n { name: 'C4', value: getRandomValue(300, 100) }\n ]\n }\n ]\n }]\n }\n },\n\n // Graph/Network Chart\n {\n title: 'Graph Chart',\n subtitle: 'Network graph example',\n type: 'graph',\n option: {\n title: {\n text: 'Graph Chart',\n subtext: 'Network graph example'\n },\n tooltip: {\n trigger: 'item' as const\n },\n toolbox: commonToolbox,\n legend: {\n data: ['Category 0', 'Category 1', 'Category 2', 'Category 3']\n },\n series: [{\n type: 'graph' as const,\n layout: 'force',\n roam: true,\n label: {\n show: true,\n color: 'auto'\n },\n force: {\n repulsion: 400,\n edgeLength: 150\n },\n categories: [\n { name: 'Category 0' },\n { name: 'Category 1' },\n { name: 'Category 2' },\n { name: 'Category 3' }\n ],\n data: [\n { id: '0', name: 'Node 1', symbolSize: 30, value: 30, category: 0 },\n { id: '1', name: 'Node 2', symbolSize: 25, value: 25, category: 1 },\n { id: '2', name: 'Node 3', symbolSize: 35, value: 35, category: 0 },\n { id: '3', name: 'Node 4', symbolSize: 20, value: 20, category: 2 },\n { id: '4', name: 'Node 5', symbolSize: 40, value: 40, category: 1 },\n { id: '5', name: 'Node 6', symbolSize: 28, value: 28, category: 3 },\n { id: '6', name: 'Node 7', symbolSize: 32, value: 32, category: 2 },\n { id: '7', name: 'Node 8', symbolSize: 22, value: 22, category: 0 },\n { id: '8', name: 'Node 9', symbolSize: 38, value: 38, category: 3 },\n { id: '9', name: 'Node 10', symbolSize: 26, value: 26, category: 1 }\n ],\n links: [\n { source: '0', target: '1' },\n { source: '0', target: '2' },\n { source: '1', target: '3' },\n { source: '2', target: '4' },\n { source: '3', target: '5' },\n { source: '4', target: '6' },\n { source: '5', target: '7' },\n { source: '6', target: '8' },\n { source: '7', target: '9' },\n { source: '8', target: '0' },\n { source: '9', target: '2' },\n { source: '1', target: '4' },\n { source: '3', target: '7' },\n { source: '5', target: '9' }\n ],\n lineStyle: {\n curveness: 0.3\n }\n }]\n }\n },\n\n // Timeline Chart\n {\n title: 'Timeline Chart',\n subtitle: 'Timeline with multiple series',\n type: 'timeline',\n option: {\n baseOption: {\n timeline: {\n axisType: 'category',\n autoPlay: false,\n data: ['2020', '2021', '2022', '2023'],\n label: {\n formatter: (value: string | number) => value.toString()\n }\n },\n title: {\n text: 'Timeline Chart',\n subtext: 'Timeline with multiple series'\n },\n tooltip: {\n trigger: 'axis' as const\n },\n legend: {\n data: ['Primary', 'Secondary', 'Tertiary']\n },\n xAxis: {\n type: 'category',\n data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']\n },\n yAxis: {\n type: 'value',\n name: 'Value'\n },\n series: [\n { name: 'Primary', type: 'bar' as const },\n { name: 'Secondary', type: 'bar' as const },\n { name: 'Tertiary', type: 'bar' as const }\n ]\n },\n options: [\n {\n title: { text: 'Timeline Chart - 2020' },\n series: [\n { data: getRandomArray(6, 800, 400) },\n { data: getRandomArray(6, 600, 300) },\n { data: getRandomArray(6, 400, 200) }\n ]\n },\n {\n title: { text: 'Timeline Chart - 2021' },\n series: [\n { data: getRandomArray(6, 900, 500) },\n { data: getRandomArray(6, 700, 400) },\n { data: getRandomArray(6, 500, 300) }\n ]\n },\n {\n title: { text: 'Timeline Chart - 2022' },\n series: [\n { data: getRandomArray(6, 1000, 600) },\n { data: getRandomArray(6, 800, 500) },\n { data: getRandomArray(6, 600, 400) }\n ]\n },\n {\n title: { text: 'Timeline Chart - 2023' },\n series: [\n { data: getRandomArray(6, 1100, 700) },\n { data: getRandomArray(6, 900, 600) },\n { data: getRandomArray(6, 700, 500) }\n ]\n }\n ]\n }\n }\n ]\n\n return configs\n}\n" }, { "path": "src/utils/download.ts", "content": "/**\n * Download utilities for theme builder\n */\n\n/**\n * Check if the browser is Safari\n */\nfunction isSafari(): boolean {\n return navigator.userAgent.indexOf('Safari') > 0 &&\n navigator.userAgent.indexOf('Chrome') < 0\n}\n\n/**\n * Save a file with the given content and filename\n * @param data - File content\n * @param filename - Name of the file\n * @param type - MIME type of the file\n */\nfunction saveFile(data: string, filename: string, type: string = 'text/plain'): void {\n if (isSafari()) {\n // Safari doesn't support Blob downloads well, use data URL\n window.open('data:text/plain;charset=utf-8,' + encodeURIComponent(data))\n } else {\n try {\n const file = new Blob([data], { type })\n const url = URL.createObjectURL(file)\n\n const a = document.createElement('a')\n a.href = url\n a.download = filename\n document.body.appendChild(a)\n a.click()\n document.body.removeChild(a)\n URL.revokeObjectURL(url)\n } catch (e) {\n console.error('Download failed:', e)\n // Fallback to data URL\n window.open('data:text/plain;charset=utf-8,' + encodeURIComponent(data))\n }\n }\n}\n\n/**\n * Download a JSON file\n * @param data - JSON data object\n * @param filename - Name of the file (without extension)\n */\nexport function downloadJsonFile(data: any, filename: string): void {\n const jsonString = JSON.stringify(data, null, 4)\n saveFile(jsonString, `${filename}.json`, 'application/json')\n}\n\n/**\n * Download a JavaScript file\n * @param content - JavaScript code content\n * @param filename - Name of the file (without extension)\n */\nexport function downloadJsFile(content: string, filename: string): void {\n saveFile(content, `${filename}.js`, 'application/javascript')\n}\n\n/**\n * Copy text to clipboard\n * @param text - Text to copy\n * @returns Promise that resolves when copy is successful\n */\nexport async function copyToClipboard(text: string): Promise {\n try {\n // Modern clipboard API\n if (navigator.clipboard && window.isSecureContext) {\n await navigator.clipboard.writeText(text)\n return true\n }\n\n // Fallback for older browsers\n const textArea = document.createElement('textarea')\n textArea.value = text\n textArea.style.position = 'fixed'\n textArea.style.left = '-999999px'\n textArea.style.top = '-999999px'\n document.body.appendChild(textArea)\n textArea.focus()\n textArea.select()\n\n const result = document.execCommand('copy')\n document.body.removeChild(textArea)\n return result\n } catch (error) {\n console.error('Failed to copy to clipboard:', error)\n return false\n }\n}\n" }, { "path": "src/utils/themeGenerator.ts", "content": "import type { ThemeData } from '../types/theme'\n\n/**\n * Generate ECharts theme configuration based on theme data\n * @param themeData - Theme configuration data\n * @returns ECharts theme configuration object\n */\nexport function generateEChartsTheme(themeData: ThemeData) {\n // Generate series style configuration\n const seriesStyle = {\n itemStyle: {\n borderWidth: themeData.symbolBorderWidth\n },\n lineStyle: {\n width: themeData.lineWidth\n },\n symbolSize: themeData.symbolSize,\n symbol: themeData.symbol,\n smooth: themeData.lineSmooth\n }\n\n // Generate item style configuration\n const itemStyle = {\n borderWidth: themeData.borderWidth,\n borderColor: themeData.borderColor\n }\n\n const border = {\n itemStyle: itemStyle\n } as any\n\n // Generate map configuration\n const mapConfig = {\n itemStyle: {\n areaColor: themeData.mapAreaColor,\n borderColor: themeData.mapBorderColor,\n borderWidth: themeData.mapBorderWidth\n },\n label: {\n color: themeData.mapLabelColor\n },\n emphasis: {\n itemStyle: {\n areaColor: themeData.mapAreaColorE,\n borderColor: themeData.mapBorderColorE,\n borderWidth: themeData.mapBorderWidthE\n },\n label: {\n color: themeData.mapLabelColorE\n }\n }\n }\n\n // Generate axis configuration helper function\n const getAxisConfig = (axisType: number) => {\n let axisIndex = 0\n if (themeData.axisSeperateSetting && axisType > 0 && axisType < themeData.axes.length) {\n axisIndex = axisType\n }\n\n const axisData = themeData.axes[axisIndex]!\n return {\n axisLine: {\n show: axisData.axisLineShow,\n lineStyle: {\n color: axisData.axisLineColor\n }\n },\n axisTick: {\n show: axisData.axisTickShow,\n lineStyle: {\n color: axisData.axisTickColor\n }\n },\n axisLabel: {\n show: axisData.axisLabelShow,\n color: axisData.axisLabelColor\n },\n splitLine: {\n show: axisData.splitLineShow,\n lineStyle: {\n color: axisData.splitLineColor\n }\n },\n splitArea: {\n show: axisData.splitAreaShow,\n areaStyle: {\n color: axisData.splitAreaColor\n }\n }\n }\n }\n\n // Generate graph style configuration\n const graphStyle = {\n ...seriesStyle,\n color: themeData.color,\n lineStyle: {\n width: themeData.graphLineWidth,\n color: themeData.graphLineColor\n },\n label: {\n color: themeData.markTextColor\n },\n itemStyle: {\n ...itemStyle,\n borderWidth: themeData.borderWidth,\n borderColor: themeData.borderColor\n }\n }\n\n // Generate candlestick configuration\n const candlestickConfig = {\n itemStyle: {\n color: themeData.kColor,\n color0: themeData.kColor0,\n borderColor: themeData.kBorderColor,\n borderColor0: themeData.kBorderColor0,\n borderWidth: themeData.kBorderWidth\n }\n }\n\n // Generate bar configuration\n const barConfig = {\n itemStyle: {\n barBorderWidth: themeData.borderWidth,\n barBorderColor: themeData.borderColor\n }\n }\n\n // Generate mark point configuration\n const markPointConfig = {\n label: {\n color: themeData.markTextColor\n },\n emphasis: {\n label: {\n color: themeData.markTextColor\n }\n }\n }\n\n // Main theme configuration object\n const themeConfig = {\n color: themeData.color,\n backgroundColor: themeData.backgroundColor, // Apply background color regardless of export state\n textStyle: themeData.textColorShow ? {\n color: themeData.textColor\n } : {},\n title: {\n textStyle: {\n color: themeData.titleColor\n },\n subtextStyle: {\n color: themeData.subtitleColor\n }\n },\n line: seriesStyle,\n radar: seriesStyle,\n bar: barConfig,\n pie: border,\n scatter: border,\n boxplot: border,\n parallel: border,\n sankey: border,\n funnel: border,\n gauge: border,\n candlestick: candlestickConfig,\n graph: graphStyle,\n map: mapConfig,\n geo: mapConfig,\n categoryAxis: getAxisConfig(1),\n valueAxis: getAxisConfig(2),\n logAxis: getAxisConfig(3),\n timeAxis: getAxisConfig(4),\n toolbox: {\n iconStyle: {\n borderColor: themeData.toolboxColor\n },\n emphasis: {\n iconStyle: {\n borderColor: themeData.toolboxEmphasisColor\n }\n }\n },\n legend: {\n textStyle: {\n color: themeData.legendTextColor\n },\n left: themeData.legendLeft === '' ? 'center' : themeData.legendLeft,\n right: themeData.legendRight === '' ? 'auto' : themeData.legendRight,\n top: themeData.legendTop === '' ? 'auto' : themeData.legendTop,\n bottom: themeData.legendBottom === '' ? 10 : themeData.legendBottom\n },\n tooltip: {\n axisPointer: {\n lineStyle: {\n color: themeData.tooltipAxisColor,\n width: themeData.tooltipAxisWidth\n },\n crossStyle: {\n color: themeData.tooltipAxisColor,\n width: themeData.tooltipAxisWidth\n }\n }\n },\n timeline: {\n lineStyle: {\n color: themeData.timelineLineColor,\n width: themeData.timelineLineWidth\n },\n itemStyle: {\n color: themeData.timelineItemColor,\n borderWidth: themeData.timelineItemBorderWidth\n },\n controlStyle: {\n color: themeData.timelineControlColor,\n borderColor: themeData.timelineControlBorderColor,\n borderWidth: themeData.timelineControlBorderWidth\n },\n checkpointStyle: {\n color: themeData.timelineCheckColor,\n borderColor: themeData.timelineCheckBorderColor\n },\n label: {\n color: themeData.timelineLabelColor\n },\n emphasis: {\n itemStyle: {\n color: themeData.timelineItemColorE\n },\n controlStyle: {\n color: themeData.timelineControlColor,\n borderColor: themeData.timelineControlBorderColor,\n borderWidth: themeData.timelineControlBorderWidth\n },\n label: {\n color: themeData.timelineLabelColor\n }\n }\n },\n visualMap: {\n color: themeData.visualMapColor\n },\n markPoint: markPointConfig,\n grid: {\n left: themeData.gridLeft === '' ? '10%' : themeData.gridLeft,\n right: themeData.gridRight === '' ? '10%' : themeData.gridRight,\n top: themeData.gridTop === '' ? 60 : themeData.gridTop,\n bottom: themeData.gridBottom === '' ? 60 : themeData.gridBottom\n }\n }\n\n return themeConfig\n}\n\n/**\n * Generate JavaScript file content for theme export\n * @param themeData - Theme configuration data\n * @param themeName - Name of the theme\n * @returns JavaScript file content as string\n */\nexport function generateThemeJsFile(themeData: ThemeData, themeName: string): string {\n const themeConfig = generateEChartsTheme(themeData)\n\n // Format theme with 4 spaces indentation\n let themeJson = JSON.stringify(themeConfig, null, ' ')\n // Indent each line with 4 spaces\n themeJson = themeJson.split('\\n').join('\\n ')\n\n return `(function (root, factory) {\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define(['exports', 'echarts'], factory);\n } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') {\n // CommonJS\n factory(exports, require('echarts'));\n } else {\n // Browser globals\n factory({}, root.echarts);\n }\n}(this, function (exports, echarts) {\n var log = function (msg) {\n if (typeof console !== 'undefined') {\n console && console.error && console.error(msg);\n }\n };\n if (!echarts) {\n log('ECharts is not Loaded');\n return;\n }\n echarts.registerTheme('${themeName}', ${themeJson});\n}));`\n}\n\n/**\n * Generate theme configuration for download\n * @param themeData - Theme configuration data\n * @param themeName - Name of the theme\n * @param version - Version number\n * @returns Configuration object for download\n */\nexport function generateThemeConfigForDownload(themeData: ThemeData, themeName: string, version: number = 1) {\n const cleanedTheme = { ...themeData }\n // Remove duplicate axis option as it's included in axes\n delete (cleanedTheme as any).axis\n\n return {\n version,\n themeName,\n theme: cleanedTheme\n }\n}\n" }, { "path": "src/vite-env.d.ts", "content": "/// \n\ninterface ImportMetaEnv {\n readonly VITE_SHOW_LANGUAGE_SELECTOR?: boolean;\n readonly VITE_APP_ASSETS_DIR: string;\n readonly VITE_EXTERNAL_ECHARTS_SCRIPT?: string;\n}\n\ninterface ImportMeta {\n readonly env: ImportMetaEnv\n}\n" }, { "path": "tsconfig.app.json", "content": "{\n \"extends\": \"@vue/tsconfig/tsconfig.dom.json\",\n \"compilerOptions\": {\n \"tsBuildInfoFile\": \"./node_modules/.tmp/tsconfig.app.tsbuildinfo\",\n\n /* Linting */\n \"strict\": true,\n \"noUnusedLocals\": true,\n \"noUnusedParameters\": true,\n \"erasableSyntaxOnly\": true,\n \"noFallthroughCasesInSwitch\": true,\n \"noUncheckedSideEffectImports\": true\n },\n \"include\": [\"src/**/*.ts\", \"src/**/*.tsx\", \"src/**/*.vue\"]\n}\n" }, { "path": "tsconfig.json", "content": "{\n \"files\": [],\n \"references\": [\n { \"path\": \"./tsconfig.app.json\" },\n { \"path\": \"./tsconfig.node.json\" }\n ]\n}\n" }, { "path": "tsconfig.node.json", "content": "{\n \"compilerOptions\": {\n \"tsBuildInfoFile\": \"./node_modules/.tmp/tsconfig.node.tsbuildinfo\",\n \"target\": \"ES2023\",\n \"lib\": [\"ES2023\"],\n \"module\": \"ESNext\",\n \"skipLibCheck\": true,\n\n /* Bundler mode */\n \"moduleResolution\": \"bundler\",\n \"allowImportingTsExtensions\": true,\n \"verbatimModuleSyntax\": true,\n \"moduleDetection\": \"force\",\n \"noEmit\": true,\n\n /* Linting */\n \"strict\": true,\n \"noUnusedLocals\": true,\n \"noUnusedParameters\": true,\n \"erasableSyntaxOnly\": true,\n \"noFallthroughCasesInSwitch\": true,\n \"noUncheckedSideEffectImports\": true\n },\n \"include\": [\"vite.config.ts\"]\n}\n" }, { "path": "vite.config.ts", "content": "import path from 'node:path'\nimport { defineConfig } from 'vite'\nimport vue from '@vitejs/plugin-vue'\nimport { viteStaticCopy } from 'vite-plugin-static-copy'\n\nexport default defineConfig((env) => {\n const isDev = env.mode === 'development'\n const isBuildForApp = env.mode === 'app'\n const publicDir = 'public'\n const assetsDir = isBuildForApp ? './theme-builder/' : './'\n return {\n plugins: [\n vue({\n template: {\n transformAssetUrls: {\n base: '/src',\n includeAbsolute: false,\n }\n }\n }),\n isBuildForApp && viteStaticCopy({\n targets: [\n {\n src: publicDir + '/*',\n dest: assetsDir\n }\n ]\n }),\n {\n // PENDING: Or set build.rollupOptions.output.format to 'umd' (will not extract css to separate file)\n name: 'remove-echarts-import',\n apply: 'build',\n generateBundle(_, bundle) {\n const reg = /import.*as(.*)from.*['\"]echarts['\"];?/g\n for (const [_fileName, chunkInfo] of Object.entries(bundle)) {\n if (chunkInfo.type === 'chunk') {\n chunkInfo.code = chunkInfo.code.replace(reg, (_match, p1) => {\n p1 = p1.trim();\n return `const ${p1}=window.echarts;!${p1}&&console.error(\"ECharts is not loaded!\");`\n })\n }\n }\n }\n }\n ],\n publicDir,\n build: {\n outDir: isBuildForApp ? 'app' : 'dist', // Target different output directories based on the build mode\n emptyOutDir: true,\n assetsDir,\n // public dir will be copied via vite-plugin-static-copy when building for app\n copyPublicDir: !isBuildForApp,\n rollupOptions: {\n external: ['echarts'],\n output: {\n format: 'module',\n globals: {\n echarts: 'echarts'\n }\n },\n input: path.resolve(__dirname, `${isBuildForApp ? 'app' : 'index'}.html`)\n }\n },\n base: './', // Make sure assets use relative paths\n resolve: {\n alias: {\n '@': path.resolve(__dirname, './src')\n }\n },\n define: {\n 'import.meta.env.VITE_SHOW_LANGUAGE_SELECTOR': !isBuildForApp,\n 'import.meta.env.VITE_EXTERNAL_ECHARTS_SCRIPT': isDev || isBuildForApp\n ? `\"\"`\n : `\"\"`,\n 'import.meta.env.VITE_APP_ASSETS_DIR': JSON.stringify(assetsDir)\n }\n }\n});\n" } ]