Theme download, 4 new themes add customize gauge

doc/asset/js/echartsTheme.js

@@ -37,6 +37,12 @@ function refreshAll() {
     }
 }
 
+function download() {
+    if (theme) {
+        window.open('theme/' + theme + '.js');
+    }
+}
+
 var hash = window.location.hash.replace('#','') || 'infographic';
 if ($('[name=theme-select]').val(hash).val() != hash) {
     $('[name=theme-select]').val('infographic');

doc/example/theme.html

@@ -58,7 +58,8 @@
                     <option name='default'>default</option>
                 </select>
             </div>
-            <button class="btn btn-info col-md-4" type="button" onclick="saveAsImage()">Save As Image</button>
+            <button class="btn btn-info col-md-2" style="margin-right: 5px;" type="button" onclick="saveAsImage()">Save As Image</button>
+            <button class="btn btn-info col-md-1" type="button" onclick="download()">Download</button>
         </div>
         
         <div class="row-fluid">
@@ -110,7 +111,8 @@
         </div><!--/row-->
         
         <div class="row">
-            <button class="btn btn-info col-md-3" type="button" onclick="saveAsImage()">Save As Image</button>
+            <button class="btn btn-info col-md-1" type="button" onclick="download()">Download</button>
+            <button class="btn btn-info col-md-2" style="margin-left: 5px;" type="button" onclick="saveAsImage()">Save As Image</button>
             <div class='col-md-6'> 
                 <select style="width:100%;height:34px;" name="theme-select">
                     <option selected="true" name='infographic'>infographic</option>

doc/example/theme/macarons2.js

@@ -210,6 +210,48 @@ define({
                 linkStyle : {}
             }
         }
+    },
+
+    gauge : {
+        axisLine: {            // 坐标轴线
+            show: true,        // 默认显示，属性show控制显示与否
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#ed9678'],[0.8, '#e7dac9'],[1, '#cb8e85']], 
+                width: 8
+            }
+        },
+        axisTick: {            // 坐标轴小标记
+            splitNumber: 10,   // 每份split细分多少段
+            length :12,        // 属性length控制线长
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: 'auto'
+            }
+        },
+        axisLabel: {           // 坐标轴文本标签，详见axis.axisLabel
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        },
+        splitLine: {           // 分隔线
+            length : 18,         // 属性length控制线长
+            lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
+                color: 'auto'
+            }
+        },
+        pointer : {
+            length : '90%',
+            color : 'auto'
+        },
+        title : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#333'
+            }
+        },
+        detail : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        }
     }
 });
                 

doc/example/theme/mint.js

@@ -128,6 +128,48 @@ define({
                 linkStyle : {}
             }
         }
+    },
+
+    gauge : {
+        axisLine: {            // 坐标轴线
+            show: true,        // 默认显示，属性show控制显示与否
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#93bc9e'],[0.8, '#8aedd5'],[1, '#a6d7c2']], 
+                width: 8
+            }
+        },
+        axisTick: {            // 坐标轴小标记
+            splitNumber: 10,   // 每份split细分多少段
+            length :12,        // 属性length控制线长
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: 'auto'
+            }
+        },
+        axisLabel: {           // 坐标轴文本标签，详见axis.axisLabel
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        },
+        splitLine: {           // 分隔线
+            length : 18,         // 属性length控制线长
+            lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
+                color: 'auto'
+            }
+        },
+        pointer : {
+            length : '90%',
+            color : 'auto'
+        },
+        title : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#333'
+            }
+        },
+        detail : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        }
     }
 });
                 

doc/example/theme/roma.js

@@ -16,7 +16,7 @@ define({
                 color0: '#001852',      
                 lineStyle: {
                     width: 1,
-                    color: '#f5e8c8',   
+                    color: '#f5e8c8',
                     color0: '#b8d2c7'   
                 }
             }
@@ -118,5 +118,47 @@ define({
                 linkStyle : {}
             }
         }
+    },
+
+    gauge : {
+        axisLine: {            // 坐标轴线
+            show: true,        // 默认显示，属性show控制显示与否
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#E01F54'],[0.8, '#b8d2c7'],[1, '#001852']], 
+                width: 8
+            }
+        },
+        axisTick: {            // 坐标轴小标记
+            splitNumber: 10,   // 每份split细分多少段
+            length :12,        // 属性length控制线长
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: 'auto'
+            }
+        },
+        axisLabel: {           // 坐标轴文本标签，详见axis.axisLabel
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        },
+        splitLine: {           // 分隔线
+            length : 18,         // 属性length控制线长
+            lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
+                color: 'auto'
+            }
+        },
+        pointer : {
+            length : '90%',
+            color : 'auto'
+        },
+        title : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#333'
+            }
+        },
+        detail : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        }
     }
 });
\ No newline at end of file

doc/example/theme/sakura.js

@@ -127,5 +127,47 @@ define({
                 linkStyle : {}
             }
         }
+    },
+    
+    gauge : {
+        axisLine: {            // 坐标轴线
+            show: true,        // 默认显示，属性show控制显示与否
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#e52c3c'],[0.8, '#f7b1ab'],[1, '#fa506c']], 
+                width: 8
+            }
+        },
+        axisTick: {            // 坐标轴小标记
+            splitNumber: 10,   // 每份split细分多少段
+            length :12,        // 属性length控制线长
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: 'auto'
+            }
+        },
+        axisLabel: {           // 坐标轴文本标签，详见axis.axisLabel
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        },
+        splitLine: {           // 分隔线
+            length : 18,         // 属性length控制线长
+            lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
+                color: 'auto'
+            }
+        },
+        pointer : {
+            length : '90%',
+            color : 'auto'
+        },
+        title : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#333'
+            }
+        },
+        detail : {
+            textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: 'auto'
+            }
+        }
     }
 });