123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214 |
- var myChart;
- var domCode = document.getElementById('sidebar-code');
- var domGraphic = document.getElementById('graphic');
- var domMain = document.getElementById('main');
- var domMessage = document.getElementById('wrong-message');
- var iconResize = document.getElementById('icon-resize');
- var needRefresh = false;
- var enVersion = location.hash.indexOf('-en') != -1;
- var hash = location.hash.replace('-en','');
- hash = hash.replace('#','') || (needMap() ? 'default' : 'macarons');
- hash += enVersion ? '-en' : '';
- var curTheme;
- function requireCallback (ec, defaultTheme) {
- curTheme = themeSelector ? defaultTheme : {};
- echarts = ec;
- refresh();
- window.onresize = myChart.resize;
- }
- var themeSelector = $('#theme-select');
- if (themeSelector) {
- themeSelector.html(
- '<option selected="true" name="macarons">macarons</option>'
- + '<option name="infographic">infographic</option>'
- + '<option name="shine">shine</option>'
- + '<option name="dark">dark</option>'
- + '<option name="blue">blue</option>'
- + '<option name="green">green</option>'
- + '<option name="red">red</option>'
- + '<option name="gray">gray</option>'
- + '<option name="helianthus">helianthus</option>'
- + '<option name="default">default</option>'
- );
- $(themeSelector).on('change', function(){
- selectChange($(this).val());
- });
- function selectChange(value){
- var theme = value;
- myChart.showLoading();
- $(themeSelector).val(theme);
- if (theme != 'default') {
- window.location.hash = value + (enVersion ? '-en' : '');
- require(['theme/' + theme], function(tarTheme){
- curTheme = tarTheme;
- setTimeout(refreshTheme, 500);
- })
- }
- else {
- window.location.hash = enVersion ? '-en' : '';
- curTheme = {};
- setTimeout(refreshTheme, 500);
- }
- }
- function refreshTheme(){
- myChart.hideLoading();
- myChart.setTheme(curTheme);
- }
- if ($(themeSelector).val(hash.replace('-en', '')).val() != hash.replace('-en', '')) {
- $(themeSelector).val('macarons');
- hash = 'macarons' + enVersion ? '-en' : '';
- window.location.hash = hash;
- }
- }
- function autoResize() {
- if ($(iconResize).hasClass('glyphicon-resize-full')) {
- focusCode();
- iconResize.className = 'glyphicon glyphicon-resize-small';
- }
- else {
- focusGraphic();
- iconResize.className = 'glyphicon glyphicon-resize-full';
- }
- }
- function focusCode() {
- domCode.className = 'col-md-8 ani';
- domGraphic.className = 'col-md-4 ani';
- }
- function focusGraphic() {
- domCode.className = 'col-md-4 ani';
- domGraphic.className = 'col-md-8 ani';
- if (needRefresh) {
- myChart.showLoading();
- setTimeout(refresh, 1000);
- }
- }
- var editor = CodeMirror.fromTextArea(
- document.getElementById("code"),
- { lineNumbers: true }
- );
- editor.setOption("theme", 'monokai');
- editor.on('change', function(){needRefresh = true;});
- function refresh(isBtnRefresh){
- if (isBtnRefresh) {
- needRefresh = true;
- focusGraphic();
- return;
- }
- needRefresh = false;
- if (myChart && myChart.dispose) {
- myChart.dispose();
- }
- myChart = echarts.init(domMain, curTheme);
- window.onresize = myChart.resize;
- (new Function(editor.doc.getValue()))();
- myChart.setOption(option, true)
- domMessage.innerHTML = '';
- }
- function needMap() {
- var href = location.href;
- return href.indexOf('map') != -1
- || href.indexOf('mix3') != -1
- || href.indexOf('mix5') != -1
- || href.indexOf('dataRange') != -1;
- }
- var echarts;
- var developMode = false;
- if (developMode) {
- window.esl = null;
- window.define = null;
- window.require = null;
- (function () {
- var script = document.createElement('script');
- script.async = true;
- var pathname = location.pathname;
- var pathSegs = pathname.slice(pathname.indexOf('doc')).split('/');
- var pathLevelArr = new Array(pathSegs.length - 1);
- script.src = pathLevelArr.join('../') + 'asset/js/esl/esl.js';
- if (script.readyState) {
- script.onreadystatechange = fireLoad;
- }
- else {
- script.onload = fireLoad;
- }
- (document.getElementsByTagName('head')[0] || document.body).appendChild(script);
-
- function fireLoad() {
- script.onload = script.onreadystatechange = null;
- setTimeout(loadedListener,100);
- }
- function loadedListener() {
- // for develop
- require.config({
- packages: [
- {
- name: 'echarts',
- location: '../../src',
- main: 'echarts'
- },
- {
- name: 'zrender',
- //location: 'http://ecomfe.github.io/zrender/src',
- location: '../../../zrender/src',
- main: 'zrender'
- }
- ]
- });
- launchExample();
- }
- })();
- }
- else {
- // for echarts online home page
- require.config({
- paths: {
- echarts: './www/js'
- }
- });
- launchExample();
- }
- var isExampleLaunched;
- function launchExample() {
- if (isExampleLaunched) {
- return;
- }
- // 按需加载
- isExampleLaunched = 1;
- require(
- [
- 'echarts',
- 'theme/' + hash.replace('-en', ''),
- 'echarts/chart/line',
- 'echarts/chart/bar',
- 'echarts/chart/scatter',
- 'echarts/chart/k',
- 'echarts/chart/pie',
- 'echarts/chart/radar',
- 'echarts/chart/force',
- 'echarts/chart/chord',
- 'echarts/chart/gauge',
- 'echarts/chart/funnel',
- 'echarts/chart/eventRiver',
- needMap() ? 'echarts/chart/map' : 'echarts'
- ],
- requireCallback
- );
- }
|