diff --git a/main.go b/main.go
index 7bda2a0..3f367a1 100644
--- a/main.go
+++ b/main.go
@@ -3,6 +3,7 @@ package main
 import (
 	"bytes"
 	"embed"
+	"encoding/base64"
 	"fmt"
 	"time"
 
@@ -50,10 +51,20 @@ func main() {
 		return nil
 	})
 	e.POST("/", func(c *elton.Context) error {
-		buf, err := charts.RenderEChartsToSVG(string(c.RequestBody))
+		outputType := c.QueryParam("outputType")
+		fn := charts.RenderEChartsToSVG
+		isPNG := false
+		if outputType == "png" {
+			isPNG = true
+			fn = charts.RenderEChartsToPNG
+		}
+		buf, err := fn(string(c.RequestBody))
 		if err != nil {
 			return err
 		}
+		if isPNG {
+			buf = []byte(base64.StdEncoding.EncodeToString(buf))
+		}
 		c.BodyBuffer = bytes.NewBuffer(buf)
 		return nil
 	})
diff --git a/web/index.css b/web/index.css
index e5f5994..7709f9b 100644
--- a/web/index.css
+++ b/web/index.css
@@ -11,6 +11,10 @@ body {
     background-color: #383838;
     text-indent: 2em;
 }
+.header span {
+    margin-left: 50px;
+    margin-right: 5px;
+}
 .codeWrapper {
     position: fixed;
     left: 0;
@@ -61,7 +65,7 @@ body {
     top: 50%;
     margin-top: -200px;
 }
-svg {
+#svg svg, #svg img {
     display: block;
     margin: auto;
 }
\ No newline at end of file
diff --git a/web/index.html b/web/index.html
index 0fb964e..4de3b5c 100644
--- a/web/index.html
+++ b/web/index.html
@@ -20,7 +20,13 @@
 </head>
 
 <body>
-    <div class="header">Go Charts</div>
+    <div class="header">Go Charts
+        <span>选择图表输出格式：</span>
+        <select id="outputType">
+            <option value="svg">SVG</option>
+            <option value="png">PNG</option>
+        </select>
+    </div>
     <div class="codeWrapper">
         <textarea id="codeInput"></textarea>
         <div class="optionTips">ECharts配置</div>
diff --git a/web/index.js b/web/index.js
index e82c2a3..7cfe3bb 100644
--- a/web/index.js
+++ b/web/index.js
@@ -35,9 +35,15 @@ function run() {
         alert(err.message);
         return;
     }
+    var dom = document.getElementById("outputType")
+    var outputType = dom.value;
 
-    axios.post("/", data).then(function(resp) {
-        document.getElementById("svg").innerHTML = resp;
+    axios.post("/?outputType=" + outputType, data).then(function(resp) {
+        if (outputType == "png") {
+            document.getElementById("svg").innerHTML = '<img src="data:image/png;base64,' + resp + '" />';
+        } else {
+            document.getElementById("svg").innerHTML = resp;
+        }
     }).catch(function(err) {
         alert(err.message);
     });
