uvue.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport"
  6. content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8. <title></title>
  9. <style type="text/css">
  10. html,
  11. body,
  12. .canvas {
  13. padding: 0;
  14. margin: 0;
  15. overflow-y: hidden;
  16. background-color: transparent;
  17. width: 100%;
  18. height: 100%;
  19. }
  20. </style>
  21. </head>
  22. <body>
  23. <div class="canvas" id="limeChart"></div>
  24. <script type="text/javascript" src="./uni.webview.1.5.5.js"></script>
  25. <script type="text/javascript" src="./echarts.min.js"></script>
  26. <script type="text/javascript" src="./ecStat.min.js"></script>
  27. <!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-liquidfill@latest/dist/echarts-liquidfill.min.js"></script> -->
  28. <script>
  29. let chart = null;
  30. let cache = [];
  31. console.log = function() {
  32. emit('log', {
  33. log: arguments,
  34. })
  35. }
  36. function emit(event, data) {
  37. postMessage({
  38. event,
  39. data
  40. })
  41. cache = []
  42. }
  43. function postMessage(data) {
  44. uni.webView.postMessage({
  45. data
  46. })
  47. // window.__uniapp_x_.postMessage(JSON.stringify(data))
  48. };
  49. function stringify(key, value) {
  50. if (typeof value === 'object' && value !== null) {
  51. if (cache.indexOf(value) !== -1) {
  52. return;
  53. }
  54. cache.push(value);
  55. }
  56. return value;
  57. }
  58. function parse(name, callback, options) {
  59. const optionNameReg = /[\w]+\.setOption\(([\w]+\.)?([\w]+)\)/
  60. if (optionNameReg.test(callback)) {
  61. const optionNames = callback.match(optionNameReg)
  62. if (optionNames[1]) {
  63. const _this = optionNames[1].split('.')[0]
  64. window[_this] = {}
  65. window[_this][optionNames[2]] = options
  66. return optionNames[2]
  67. } else {
  68. return null
  69. }
  70. }
  71. return null
  72. }
  73. function init(callback, options, opts, theme) {
  74. if (!chart) {
  75. chart = echarts.init(document.getElementById('limeChart'), theme, opts)
  76. if (options) {
  77. chart.setOption(options)
  78. }
  79. }
  80. }
  81. function on(data) {
  82. if (chart && data.length > 0) {
  83. const [type, query] = data
  84. const key = `${type}${JSON.stringify(query||'')}`
  85. if (query) {
  86. chart.on(type, query, function(options) {
  87. var obj = {};
  88. Object.keys(options).forEach(function(key) {
  89. if (key != 'event') {
  90. obj[key] = options[key];
  91. }
  92. });
  93. emit(key, {
  94. event: key,
  95. options: obj,
  96. });
  97. });
  98. } else {
  99. chart.on(type, function(options) {
  100. var obj = {};
  101. Object.keys(options).forEach(function(key) {
  102. if (key != 'event') {
  103. obj[key] = options[key];
  104. }
  105. });
  106. emit(key, {
  107. event: key,
  108. options: obj,
  109. });
  110. });
  111. }
  112. }
  113. }
  114. function setChart(callback, options) {
  115. if (!callback) return
  116. if (chart && callback && options) {
  117. var r = null
  118. const name = parse('r', callback, options)
  119. if (name) this[name] = options
  120. eval(`r = ${callback};`)
  121. if (r) {
  122. r(chart)
  123. }
  124. }
  125. }
  126. function setOption(data) {
  127. if (chart) chart.setOption(data[0], data[1])
  128. }
  129. function showLoading(data) {
  130. if (chart) chart.showLoading(data[0], data[1])
  131. }
  132. function hideLoading() {
  133. if (chart) chart.hideLoading()
  134. }
  135. function clear() {
  136. if (chart) chart.clear()
  137. }
  138. function dispose() {
  139. if (chart) chart.dispose()
  140. }
  141. function resize(size) {
  142. if (chart) chart.resize(size)
  143. }
  144. function canvasToTempFilePath(opt) {
  145. if (chart) {
  146. delete opt.success
  147. const src = chart.getDataURL(opt)
  148. postMessage({
  149. // event: 'file',
  150. file: src
  151. })
  152. }
  153. }
  154. document.addEventListener('touchmove', () => {
  155. })
  156. </script>
  157. </body>
  158. </html>