en/download-theme.html - echarts-website - Git at Google

 <!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"><meta name="description" content="Apache ECharts, a powerful, interactive charting and visualization library for browser"><meta name="keywords" content="echarts,apache,charts,data-visualization,charting-library,visualization,data-viz,canvas,svg,plot,graph"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://fastly.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=a95711177c"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
         + '@font-face {font-family:"noto-thin";src:local("Microsoft Yahei");}'
         + '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Download Themes - Apache ECharts</title><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/vendors/prettify/prettify.css?_v_=20200710_1"><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script></head><!--[if lte IE 8]><body class="lower-ie"><div id="lowie-main"><img src="https://echarts.apache.org/en/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
 <!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><noscript><div class="no-script"><strong>We're sorry, but Apache ECharts website doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></div></noscript><div id="apache-banner"><div class="txt"><p>Please visit the official Apache ECharts Website at</p><a id="a2" href="https://echarts.apache.org/en/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="main"><nav class="navbar navbar-default navbar-fixed-top"><nav role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/handbook/en/get-started/">Handbook</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li><li><a href="https://echarts.apache.org/handbook/en/basics/release-note/v5-upgrade-guide">V5 Upgrade Guide</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/events.html">Events</a></li><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">ASF<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">License<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/events/current-event" target="_blank">Events<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li></ul></div></div></nav></nav><div class="page-main"><div class="page-info"><div id="themes" class="container"><h1>Download Themes</h1><p>Change the look of your charts.</p><p>You can also make your own theme along with using the themes we provide.</p><p class="page-info-echarts">Apache ECharts<sup>TM</sup></p></div></div><div id="themes" class="page-content container"><div class="row"><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/vintage.js?_v_=20200710_1" download="vintage.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/vintage.png?_v_=20200710_1" alt=""></a><p>vintage</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/dark.js?_v_=20200710_1" download="dark.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/dark.png?_v_=20200710_1" alt=""></a><p>dark</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/macarons.js?_v_=20200710_1" download="macarons.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/macarons.png?_v_=20200710_1" alt=""></a><p>macarons</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/infographic.js?_v_=20200710_1" download="infographic.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/infographic.png?_v_=20200710_1" alt=""></a><p>infographic</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/shine.js?_v_=20200710_1" download="shine.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/shine.png?_v_=20200710_1" alt=""></a><p>shine</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/roma.js?_v_=20200710_1" download="roma.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/roma.png?_v_=20200710_1" alt=""></a><p>roma</p></div></div></div><section id="theme-configure-section" class="section-bg"><div class="container"><div id="theme-builder"><a href="https://echarts.apache.org/en/theme-builder.html" class="btn btn-main btn-thirdary more-btn">Theme Builder</a><p>Make a custom theme and use it for your charts.</p></div></div></section><section><div class="container"><div id="theme-example"><h4>An example of using a theme</h4><pre class="html">&lt;script src="echarts.js"&gt;&lt;/script&gt;
 &lt;!-- import vintage theme --&gt;
 &lt;script src="theme/vintage.js"&gt;&lt;/script&gt;
 &lt;script&gt;
 // The second parameter is the name of the theme imported
 var chart = echarts.init(document.getElementById('main'), 'vintage');
 chart.setOption({
     ...
 });
 &lt;/script&gt;
 </pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Copyright © 2017-2023, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/ApacheECharts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=85b684f192"></script><script src="https://fastly.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://fastly.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';

 $('pre').addClass('prettyprint');
 prettyPrint();

 $('.download-theme').click(function (e) {
     typeof _hmt === 'object' && _hmt && _hmt.push(['_trackEvent', 'download-theme', 'download-theme', '']);
     var ctx = this;
     if (ctx.origin === location.origin) {
         return;
     }
     // cross origin
     e.preventDefault();
     function onload(res) {
         var download = ctx.getAttribute('download');
         var url;
         if (res && res instanceof Blob) {
             if (window.navigator.msSaveOrOpenBlob) {
                 if (window.navigator.msSaveOrOpenBlob(res, download)) {
                     return;
                 }
             } else {
                 url = URL.createObjectURL(res);
             }
         }
         var a = document.createElement('a');
         a.href = url || ctx.href;
         a.target = ctx.target;
         a.setAttribute('download', download);
         a.style.display = 'none';
         document.body.appendChild(a);
         a.click();
         document.body.removeChild(a);
         url && URL.revokeObjectURL(url);
     }
     if ((typeof URL !== 'undefined' && typeof URL.createObjectURL === 'function') || window.navigator.msSaveOrOpenBlob) {
         var xhr = new XMLHttpRequest();
         xhr.open('GET', ctx.href);
         xhr.responseType = 'blob';
         xhr.onload = function () {
             onload(this.status === 200 && this.response);
         };
         xhr.onerror = function (e) {
             console.error('failed to download theme', e);
         };
         xhr.send();
     } else {
         onload();
     }
     _hmt.push(['_trackEvent', 'download-theme', 'download-theme', '']);
 });</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");

 hm.src = "https://hm.baidu.com/hm.js?54b918eee37cb8a7045f0fd0f0b24395";

 var s = document.getElementsByTagName("script")[0];
 s.parentNode.insertBefore(hm, s);
 })();
 </script><!-- Google Analytics--><script type="text/javascript" async src="https://www.googletagmanager.com/gtag/js?id=UA-141228404-1"></script><script type="text/javascript">window.dataLayer = window.dataLayer || [];
 function gtag(){dataLayer.push(arguments);}
 gtag('js', new Date());
 gtag('config', 'UA-141228404-1');</script></html>
	<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"><meta name="description" content="Apache ECharts, a powerful, interactive charting and visualization library for browser"><meta name="keywords" content="echarts,apache,charts,data-visualization,charting-library,visualization,data-viz,canvas,svg,plot,graph"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://fastly.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=a95711177c"><script>window.EC_WWW_LANG = 'en';
	</script><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
	var el = document.createElement('style');
	el.innerHTML = ''
	+ '@font-face {font-family:"noto-thin";src:local("Microsoft Yahei");}'
	+ '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
	document.head.insertBefore(el, document.getElementById('font-hack'));
	}
	</script><title>Download Themes - Apache ECharts</title><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/vendors/prettify/prettify.css?_v_=20200710_1"><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script></head><!--[if lte IE 8]><body class="lower-ie"><div id="lowie-main"><img src="https://echarts.apache.org/en/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
	<!--[if (gt IE 8)\|!(IE)]><body class="undefined"></body><![endif]--><noscript><div class="no-script"><strong>We're sorry, but Apache ECharts website doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></div></noscript><div id="apache-banner"><div class="txt"><p>Please visit the official Apache ECharts Website at</p><a id="a2" href="https://echarts.apache.org/en/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="main"><nav class="navbar navbar-default navbar-fixed-top"><nav role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/handbook/en/get-started/">Handbook</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li><li><a href="https://echarts.apache.org/handbook/en/basics/release-note/v5-upgrade-guide">V5 Upgrade Guide</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/events.html">Events</a></li><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">ASF<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">License<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/events/current-event" target="_blank">Events<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li></ul></div></div></nav></nav><div class="page-main"><div class="page-info"><div id="themes" class="container"><h1>Download Themes</h1><p>Change the look of your charts.</p><p>You can also make your own theme along with using the themes we provide.</p><p class="page-info-echarts">Apache ECharts<sup>TM</sup></p></div></div><div id="themes" class="page-content container"><div class="row"><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/vintage.js?_v_=20200710_1" download="vintage.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/vintage.png?_v_=20200710_1" alt=""></a><p>vintage</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/dark.js?_v_=20200710_1" download="dark.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/dark.png?_v_=20200710_1" alt=""></a><p>dark</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/macarons.js?_v_=20200710_1" download="macarons.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/macarons.png?_v_=20200710_1" alt=""></a><p>macarons</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/infographic.js?_v_=20200710_1" download="infographic.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/infographic.png?_v_=20200710_1" alt=""></a><p>infographic</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/shine.js?_v_=20200710_1" download="shine.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/shine.png?_v_=20200710_1" alt=""></a><p>shine</p></div><div class="col-sm-4 theme"><a href="https://fastly.jsdelivr.net/npm/echarts/theme/roma.js?_v_=20200710_1" download="roma.js" target="_blank" class="download-theme"><img src="https://echarts.apache.org/en/asset/theme/thumb/roma.png?_v_=20200710_1" alt=""></a><p>roma</p></div></div></div><section id="theme-configure-section" class="section-bg"><div class="container"><div id="theme-builder"><a href="https://echarts.apache.org/en/theme-builder.html" class="btn btn-main btn-thirdary more-btn">Theme Builder</a><p>Make a custom theme and use it for your charts.</p></div></div></section><section><div class="container"><div id="theme-example"><h4>An example of using a theme</h4><pre class="html"><script src="echarts.js"></script>
	<!-- import vintage theme -->
	<script src="theme/vintage.js"></script>
	<script>
	// The second parameter is the name of the theme imported
	var chart = echarts.init(document.getElementById('main'), 'vintage');
	chart.setOption({
	...
	});
	</script>
	</pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Copyright © 2017-2023, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/ApacheECharts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=85b684f192"></script><script src="https://fastly.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://fastly.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';

	$('pre').addClass('prettyprint');
	prettyPrint();

	$('.download-theme').click(function (e) {
	typeof _hmt === 'object' && _hmt && _hmt.push(['_trackEvent', 'download-theme', 'download-theme', '']);
	var ctx = this;
	if (ctx.origin === location.origin) {
	return;
	}
	// cross origin
	e.preventDefault();
	function onload(res) {
	var download = ctx.getAttribute('download');
	var url;
	if (res && res instanceof Blob) {
	if (window.navigator.msSaveOrOpenBlob) {
	if (window.navigator.msSaveOrOpenBlob(res, download)) {
	return;
	}
	} else {
	url = URL.createObjectURL(res);
	}
	}
	var a = document.createElement('a');
	a.href = url \|\| ctx.href;
	a.target = ctx.target;
	a.setAttribute('download', download);
	a.style.display = 'none';
	document.body.appendChild(a);
	a.click();
	document.body.removeChild(a);
	url && URL.revokeObjectURL(url);
	}
	if ((typeof URL !== 'undefined' && typeof URL.createObjectURL === 'function') \|\| window.navigator.msSaveOrOpenBlob) {
	var xhr = new XMLHttpRequest();
	xhr.open('GET', ctx.href);
	xhr.responseType = 'blob';
	xhr.onload = function () {
	onload(this.status === 200 && this.response);
	};
	xhr.onerror = function (e) {
	console.error('failed to download theme', e);
	};
	xhr.send();
	} else {
	onload();
	}
	_hmt.push(['_trackEvent', 'download-theme', 'download-theme', '']);
	});</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt \|\| [];
	(function() {
	var hm = document.createElement("script");

	hm.src = "https://hm.baidu.com/hm.js?54b918eee37cb8a7045f0fd0f0b24395";

	var s = document.getElementsByTagName("script")[0];
	s.parentNode.insertBefore(hm, s);
	})();
	</script><!-- Google Analytics--><script type="text/javascript" async src="https://www.googletagmanager.com/gtag/js?id=UA-141228404-1"></script><script type="text/javascript">window.dataLayer = window.dataLayer \|\| [];
	function gtag(){dataLayer.push(arguments);}
	gtag('js', new Date());
	gtag('config', 'UA-141228404-1');</script></html>