You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by wa...@apache.org on 2022/08/03 06:39:28 UTC
[echarts-doc] branch master updated: feat(preview): support redirecting to echarts-example editor to edit preview code
This is an automated email from the ASF dual-hosted git repository.
wangzx pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/echarts-doc.git
The following commit(s) were added to refs/heads/master by this push:
new ffcd7758 feat(preview): support redirecting to echarts-example editor to edit preview code
ffcd7758 is described below
commit ffcd7758cf90e48d5eaa2424be1305dc23c83438
Author: plainheart <yh...@all-my-life.cn>
AuthorDate: Wed Aug 3 14:38:58 2022 +0800
feat(preview): support redirecting to echarts-example editor to edit preview code
---
package-lock.json | 14 ++++++++++++++
package.json | 1 +
src/components/LiveExample.vue | 30 ++++++++++++++++++++++++++++--
src/i18n.js | 8 ++++++--
4 files changed, 49 insertions(+), 4 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index 56cab97d..c5546ea2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
"codemirror": "^5.54.0",
"highlight.js": "^9.18.1",
"lodash-es": "^4.17.21",
+ "lz-string": "^1.4.4",
"mark.js": "^8.11.1",
"scroll-into-view": "^1.16.2",
"string-similarity-js": "^2.1.4",
@@ -5925,6 +5926,14 @@
"yallist": "^2.1.2"
}
},
+ "node_modules/lz-string": {
+ "version": "1.4.4",
+ "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
+ "integrity": "sha512-0ckx7ZHRPqb0oUm8zNr+90mtf9DQB60H1wMCjBtfi62Kl3a7JbHob6gA2bC+xRvZoOL+1hzUK8jeuEIQE8svEQ==",
+ "bin": {
+ "lz-string": "bin/bin.js"
+ }
+ },
"node_modules/make-dir": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@@ -15320,6 +15329,11 @@
"yallist": "^2.1.2"
}
},
+ "lz-string": {
+ "version": "1.4.4",
+ "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
+ "integrity": "sha512-0ckx7ZHRPqb0oUm8zNr+90mtf9DQB60H1wMCjBtfi62Kl3a7JbHob6gA2bC+xRvZoOL+1hzUK8jeuEIQE8svEQ=="
+ },
"make-dir": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
diff --git a/package.json b/package.json
index 63dbbe7c..822c9ef4 100644
--- a/package.json
+++ b/package.json
@@ -47,6 +47,7 @@
"codemirror": "^5.54.0",
"highlight.js": "^9.18.1",
"lodash-es": "^4.17.21",
+ "lz-string": "^1.4.4",
"mark.js": "^8.11.1",
"scroll-into-view": "^1.16.2",
"string-similarity-js": "^2.1.4",
diff --git a/src/components/LiveExample.vue b/src/components/LiveExample.vue
index a08fecf8..677547aa 100644
--- a/src/components/LiveExample.vue
+++ b/src/components/LiveExample.vue
@@ -5,7 +5,14 @@
<div class="preview-and-code" v-if="shared.currentExampleOption">
<div class="preview-main"></div>
<div class="example-code">
- <div class="codemirror-main"></div>
+ <div class="codemirror-main">
+ <el-link
+ icon="el-icon-edit-outline"
+ class="btn-to-editor"
+ :title="$t('example.toEditor')"
+ @click="toEditor"
+ />
+ </div>
</div>
<el-alert
:title="$t('example.setOptionError')"
@@ -73,6 +80,7 @@ import beautifier from 'js-beautify';
import {throttle} from 'lodash-es';
import arrayDiff from 'zrender/lib/core/arrayDiff';
import {ECHARTS_LIB} from '../config';
+import { compressToBase64 } from 'lz-string';
let echartsLoadPromise;
@@ -288,7 +296,6 @@ export default {
resize() {
const examplePanel = this.$el;
- const previewMain = examplePanel.querySelector('.preview-main');
if (this.shared.computedOptionExampleLayout !== 'right') {
examplePanel.style.height = (window.innerHeight * 0.5 - 60) + 'px';
examplePanel.style.width = 'auto';
@@ -342,6 +349,14 @@ export default {
this.$nextTick(() => {
this.resize();
});
+ },
+
+ toEditor() {
+ const code = compressToBase64(this.formattedOptionCodeStr)
+ .replace(/\+/g, '-')
+ .replace(/\//g, '_')
+ .replace(/=+$/, '');
+ window.open(`https://echarts.apache.org/examples/editor.html?code=${code}&_source=echarts-doc-preview`, '_blank');
}
},
@@ -462,6 +477,17 @@ export default {
}
}
}
+
+ .btn-to-editor {
+ position: absolute;
+ right: 5px;
+ top: 8px;
+ z-index: 10;
+
+ &:not(:hover) {
+ color: #fff;
+ }
+ }
}
.toolbar {
diff --git a/src/i18n.js b/src/i18n.js
index 93d3a4f6..10b51744 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -49,7 +49,9 @@ export default {
right: 'Right',
top: 'Top',
bottom: 'Bottom'
- }
+ },
+
+ toEditor: 'To Editor'
}
},
zh: {
@@ -102,7 +104,9 @@ export default {
right: '右侧',
top: '顶部',
bottom: '底部'
- }
+ },
+
+ toEditor: '前往编辑器'
}
}
};
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org