djws.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. //经济指标命名映射
  2. var eNameMap = {
  3. 'GDP' : 'GDP',
  4. 'Financial' : '金融',
  5. 'Estate' : '房地产',
  6. 'PI' : '第一产业',
  7. 'SI' : '第二产业',
  8. 'TI' : '第三产业'
  9. };
  10. //颜色映射
  11. var eColorMap = {
  12. 'GDP' : '#1e90ff',
  13. 'Financial' : '#ff7f50',
  14. 'Estate' : '#da70d6',
  15. 'PI' : '#32cd32',
  16. 'SI' : '#6495ed',
  17. 'TI' : '#ff69b4'
  18. };
  19. //---------
  20. var developMode = false;
  21. if (developMode) {
  22. window.esl = null;
  23. window.define = null;
  24. window.require = null;
  25. (function () {
  26. var script = document.createElement('script');
  27. script.async = true;
  28. var pathname = location.pathname;
  29. var pathSegs = pathname.slice(pathname.indexOf('doc')).split('/');
  30. var pathLevelArr = new Array(pathSegs.length - 1);
  31. script.src = pathLevelArr.join('../') + 'asset/js/esl/esl.js';
  32. if (script.readyState) {
  33. script.onreadystatechange = fireLoad;
  34. }
  35. else {
  36. script.onload = fireLoad;
  37. }
  38. (document.getElementsByTagName('head')[0] || document.body).appendChild(script);
  39. function fireLoad() {
  40. script.onload = script.onreadystatechange = null;
  41. setTimeout(loadedListener,100);
  42. }
  43. function loadedListener() {
  44. // for develop
  45. require.config({
  46. packages: [
  47. {
  48. name: 'echarts',
  49. location: '../../../../src',
  50. main: 'echarts'
  51. },
  52. {
  53. name: 'zrender',
  54. //location: 'http://ecomfe.github.io/zrender/src',
  55. location: '../../../../../zrender/src',
  56. main: 'zrender'
  57. }
  58. ]
  59. });
  60. launchExample();
  61. }
  62. })();
  63. }
  64. else {
  65. require.config({
  66. paths: {
  67. echarts: '../../www/js'
  68. }
  69. });
  70. launchExample();
  71. }
  72. var EC_READY = false;
  73. var myChart0;
  74. var isExampleLaunched;
  75. function launchExample() {
  76. if (isExampleLaunched) {
  77. return;
  78. }
  79. // 按需加载
  80. isExampleLaunched = 1;
  81. require(
  82. [
  83. 'echarts',
  84. 'echarts/chart/line',
  85. 'echarts/chart/bar',
  86. 'echarts/chart/scatter',
  87. //'echarts/chart/k',
  88. 'echarts/chart/pie',
  89. 'echarts/chart/radar',
  90. //'echarts/chart/force',
  91. //'echarts/chart/chord',
  92. 'echarts/chart/map'
  93. ],
  94. function (ec) {
  95. EC_READY = true;
  96. myChart0 = ec.init(document.getElementById('g0')).setOption(option0());
  97. showTabContent(1);
  98. }
  99. );
  100. }
  101. var curTabIdx = 1;
  102. $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  103. // e.target // activated tab
  104. // e.relatedTarget // previous tab
  105. if (!EC_READY) {
  106. return;
  107. }
  108. hideTabContent(curTabIdx);
  109. curTabIdx = e.target.id.replace('tab','');
  110. showTabContent(curTabIdx);
  111. });
  112. var curYear = '2002';
  113. $('button').on('click', function (e) {
  114. $('#' + curYear)[0].className = 'btn btn-info';
  115. curYear = e.target.id;
  116. $('#' + curYear)[0].className = 'btn btn-success';
  117. showTabContent(curTabIdx);
  118. });
  119. var curEIndex = 'GDP';
  120. $('input:radio[name="optionsRadios"]').on('change', function (e) {
  121. curRange = false;
  122. curEIndex = e.target.value;
  123. showTabContent(curTabIdx);
  124. });
  125. var functionMap = {};
  126. function showTabContent(idx) {
  127. functionMap['chart' + idx](idx);
  128. }
  129. function hideTabContent(idx) {
  130. functionMap['chart' + idx + 'dispose'](idx);
  131. }
  132. // last chart
  133. var myChart3;
  134. var curSelected = {
  135. 'GDP' : true,
  136. '金融' : false,
  137. '房地产' : true,
  138. '第一产业' : false,
  139. '第二产业' : false,
  140. '第三产业' : false
  141. };
  142. functionMap.chart3 = function (idx) {
  143. functionMap.chart3dispose(idx);
  144. myChart3 = require('echarts').init(document.getElementById('g' + idx));
  145. myChart3.setOption(option1(curSelected));
  146. // 图例状态保持
  147. myChart3.on(require('echarts/config').EVENT.LEGEND_SELECTED, function (param){
  148. curSelected = param.selected;
  149. });
  150. }
  151. functionMap.chart3dispose = function () {
  152. if (myChart3) {
  153. myChart3.dispose();
  154. myChart3 = false;
  155. }
  156. }
  157. // second chart
  158. var myChart20;
  159. var myChart21;
  160. var myChart22;
  161. var myChart23;
  162. var myChart24;
  163. var myChart25;
  164. functionMap.chart2 = function (idx) {
  165. functionMap.chart2dispose(idx);
  166. var ec = require('echarts');
  167. myChart20 = ec.init(document.getElementById('g20'));
  168. myChart21 = ec.init(document.getElementById('g21'));
  169. myChart22 = ec.init(document.getElementById('g22'));
  170. myChart23 = ec.init(document.getElementById('g23'));
  171. myChart24 = ec.init(document.getElementById('g24'));
  172. myChart25 = ec.init(document.getElementById('g25'));
  173. myChart20.setOption(option2('GDP'));
  174. myChart21.setOption(option2('Financial'));
  175. myChart22.setOption(option2('Estate'));
  176. myChart23.setOption(option2('PI'));
  177. myChart24.setOption(option2('SI'));
  178. myChart25.setOption(option2('TI'));
  179. }
  180. functionMap.chart2dispose = function () {
  181. if (myChart20) {
  182. myChart20.dispose();
  183. myChart21.dispose();
  184. myChart22.dispose();
  185. myChart23.dispose();
  186. myChart24.dispose();
  187. myChart25.dispose();
  188. myChart20 = false;
  189. myChart21 = false;
  190. myChart22 = false;
  191. myChart23 = false;
  192. myChart24 = false;
  193. myChart25 = false;
  194. }
  195. }
  196. // first chart
  197. var myChart1;
  198. var curRange = false;
  199. functionMap.chart1 = function (idx) {
  200. functionMap.chart1dispose(idx);
  201. myChart1 = require('echarts').init(document.getElementById('g' + idx));
  202. myChart1.setOption(option3(curEIndex));
  203. }
  204. functionMap.chart1dispose = function () {
  205. if (myChart1) {
  206. myChart1.dispose();
  207. myChart1 = false;
  208. }
  209. }
  210. var resizeTicket;
  211. window.onload = function () {
  212. window.onresize = function () {
  213. clearTimeout(resizeTicket);
  214. resizeTicket = setTimeout(function (){
  215. myChart0.resize();
  216. if (curTabIdx == 1) {
  217. myChart1.resize();
  218. }
  219. else if (curTabIdx == 2) {
  220. myChart20.resize();
  221. myChart21.resize();
  222. myChart22.resize();
  223. myChart23.resize();
  224. myChart24.resize();
  225. myChart25.resize();
  226. }
  227. else {
  228. myChart3.resize();
  229. }
  230. },200);
  231. }
  232. }