default.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing,
  13. * software distributed under the License is distributed on an
  14. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15. * KIND, either express or implied. See the License for the
  16. * specific language governing permissions and limitations
  17. * under the License.
  18. */
  19. var zrUtil = require("zrender/lib/core/util");
  20. var graphic = require("../util/graphic");
  21. /*
  22. * Licensed to the Apache Software Foundation (ASF) under one
  23. * or more contributor license agreements. See the NOTICE file
  24. * distributed with this work for additional information
  25. * regarding copyright ownership. The ASF licenses this file
  26. * to you under the Apache License, Version 2.0 (the
  27. * "License"); you may not use this file except in compliance
  28. * with the License. You may obtain a copy of the License at
  29. *
  30. * http://www.apache.org/licenses/LICENSE-2.0
  31. *
  32. * Unless required by applicable law or agreed to in writing,
  33. * software distributed under the License is distributed on an
  34. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  35. * KIND, either express or implied. See the License for the
  36. * specific language governing permissions and limitations
  37. * under the License.
  38. */
  39. var PI = Math.PI;
  40. /**
  41. * @param {module:echarts/ExtensionAPI} api
  42. * @param {Object} [opts]
  43. * @param {string} [opts.text]
  44. * @param {string} [opts.color]
  45. * @param {string} [opts.textColor]
  46. * @return {module:zrender/Element}
  47. */
  48. function _default(api, opts) {
  49. opts = opts || {};
  50. zrUtil.defaults(opts, {
  51. text: 'loading',
  52. color: '#c23531',
  53. textColor: '#000',
  54. maskColor: 'rgba(255, 255, 255, 0.8)',
  55. zlevel: 0
  56. });
  57. var mask = new graphic.Rect({
  58. style: {
  59. fill: opts.maskColor
  60. },
  61. zlevel: opts.zlevel,
  62. z: 10000
  63. });
  64. var arc = new graphic.Arc({
  65. shape: {
  66. startAngle: -PI / 2,
  67. endAngle: -PI / 2 + 0.1,
  68. r: 10
  69. },
  70. style: {
  71. stroke: opts.color,
  72. lineCap: 'round',
  73. lineWidth: 5
  74. },
  75. zlevel: opts.zlevel,
  76. z: 10001
  77. });
  78. var labelRect = new graphic.Rect({
  79. style: {
  80. fill: 'none',
  81. text: opts.text,
  82. textPosition: 'right',
  83. textDistance: 10,
  84. textFill: opts.textColor
  85. },
  86. zlevel: opts.zlevel,
  87. z: 10001
  88. });
  89. arc.animateShape(true).when(1000, {
  90. endAngle: PI * 3 / 2
  91. }).start('circularInOut');
  92. arc.animateShape(true).when(1000, {
  93. startAngle: PI * 3 / 2
  94. }).delay(300).start('circularInOut');
  95. var group = new graphic.Group();
  96. group.add(arc);
  97. group.add(labelRect);
  98. group.add(mask); // Inject resize
  99. group.resize = function () {
  100. var cx = api.getWidth() / 2;
  101. var cy = api.getHeight() / 2;
  102. arc.setShape({
  103. cx: cx,
  104. cy: cy
  105. });
  106. var r = arc.shape.r;
  107. labelRect.setShape({
  108. x: cx - r,
  109. y: cy - r,
  110. width: r * 2,
  111. height: r * 2
  112. });
  113. mask.setShape({
  114. x: 0,
  115. y: 0,
  116. width: api.getWidth(),
  117. height: api.getHeight()
  118. });
  119. };
  120. group.resize();
  121. return group;
  122. }
  123. module.exports = _default;