refactor: adjust charts preview
This commit is contained in:
parent
ebc566fc9d
commit
fea5649efb
3 changed files with 39 additions and 4 deletions
|
|
@ -26,6 +26,17 @@ body {
|
|||
top: 60px;
|
||||
bottom: 50px;
|
||||
}
|
||||
.optionTips {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 10px;
|
||||
}
|
||||
.previewTips {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 10px;
|
||||
color: #fff;
|
||||
}
|
||||
.run {
|
||||
display: block;
|
||||
position: fixed;
|
||||
|
|
@ -43,8 +54,12 @@ body {
|
|||
.run:active, .run:visited {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#svg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -200px;
|
||||
}
|
||||
svg {
|
||||
display: block;
|
||||
margin: 30px auto;
|
||||
margin: auto;
|
||||
}
|
||||
|
|
@ -12,11 +12,16 @@
|
|||
|
||||
<body>
|
||||
<div class="header">Go Charts</div>
|
||||
<div class="codeWrapper"><textarea id="codeInput"></textarea></div>
|
||||
<div class="codeWrapper">
|
||||
<textarea id="codeInput"></textarea>
|
||||
<div class="optionTips">ECharts配置</div>
|
||||
</div>
|
||||
<div class="previewWrapper">
|
||||
<div id="svg"></div>
|
||||
<div class="previewTips">图表SVG效果</div>
|
||||
</div>
|
||||
<a href="#" class="run" onclick="run()">运行</a>
|
||||
</body>
|
||||
<script src="/static/index.js"></script>
|
||||
|
||||
</html>
|
||||
17
web/index.js
17
web/index.js
|
|
@ -8,7 +8,22 @@ editor.setSize("100%", height);
|
|||
|
||||
function run() {
|
||||
var option = editor.getValue();
|
||||
axios.post("/", JSON.parse(option)).then(function(resp) {
|
||||
var data = null;
|
||||
try {
|
||||
if (option.indexOf("option = ") !== -1) {
|
||||
var fn = new Function("var " + option + ";return option;");
|
||||
data = fn();
|
||||
} else {
|
||||
data = JSON.parse(option);
|
||||
}
|
||||
} catch (err) {
|
||||
alert(err.message);
|
||||
return;
|
||||
}
|
||||
|
||||
axios.post("/", data).then(function(resp) {
|
||||
document.getElementById("svg").innerHTML = resp;
|
||||
}).catch(function(err) {
|
||||
alert(err.message);
|
||||
});
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue