MapView.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. var echarts = require("../../echarts");
  2. var zrUtil = require("zrender/lib/core/util");
  3. var graphic = require("../../util/graphic");
  4. var MapDraw = require("../../component/helper/MapDraw");
  5. var _default = echarts.extendChartView({
  6. type: 'map',
  7. render: function (mapModel, ecModel, api, payload) {
  8. // Not render if it is an toggleSelect action from self
  9. if (payload && payload.type === 'mapToggleSelect' && payload.from === this.uid) {
  10. return;
  11. }
  12. var group = this.group;
  13. group.removeAll();
  14. if (mapModel.getHostGeoModel()) {
  15. return;
  16. } // Not update map if it is an roam action from self
  17. if (!(payload && payload.type === 'geoRoam' && payload.componentType === 'series' && payload.seriesId === mapModel.id)) {
  18. if (mapModel.needsDrawMap) {
  19. var mapDraw = this._mapDraw || new MapDraw(api, true);
  20. group.add(mapDraw.group);
  21. mapDraw.draw(mapModel, ecModel, api, this, payload);
  22. this._mapDraw = mapDraw;
  23. } else {
  24. // Remove drawed map
  25. this._mapDraw && this._mapDraw.remove();
  26. this._mapDraw = null;
  27. }
  28. } else {
  29. var mapDraw = this._mapDraw;
  30. mapDraw && group.add(mapDraw.group);
  31. }
  32. mapModel.get('showLegendSymbol') && ecModel.getComponent('legend') && this._renderSymbols(mapModel, ecModel, api);
  33. },
  34. remove: function () {
  35. this._mapDraw && this._mapDraw.remove();
  36. this._mapDraw = null;
  37. this.group.removeAll();
  38. },
  39. dispose: function () {
  40. this._mapDraw && this._mapDraw.remove();
  41. this._mapDraw = null;
  42. },
  43. _renderSymbols: function (mapModel, ecModel, api) {
  44. var originalData = mapModel.originalData;
  45. var group = this.group;
  46. originalData.each('value', function (value, idx) {
  47. if (isNaN(value)) {
  48. return;
  49. }
  50. var layout = originalData.getItemLayout(idx);
  51. if (!layout || !layout.point) {
  52. // Not exists in map
  53. return;
  54. }
  55. var point = layout.point;
  56. var offset = layout.offset;
  57. var circle = new graphic.Circle({
  58. style: {
  59. // Because the special of map draw.
  60. // Which needs statistic of multiple series and draw on one map.
  61. // And each series also need a symbol with legend color
  62. //
  63. // Layout and visual are put one the different data
  64. fill: mapModel.getData().getVisual('color')
  65. },
  66. shape: {
  67. cx: point[0] + offset * 9,
  68. cy: point[1],
  69. r: 3
  70. },
  71. silent: true,
  72. // Do not overlap the first series, on which labels are displayed.
  73. z2: !offset ? 10 : 8
  74. }); // First data on the same region
  75. if (!offset) {
  76. var fullData = mapModel.mainSeries.getData();
  77. var name = originalData.getName(idx);
  78. var fullIndex = fullData.indexOfName(name);
  79. var itemModel = originalData.getItemModel(idx);
  80. var labelModel = itemModel.getModel('label.normal');
  81. var hoverLabelModel = itemModel.getModel('label.emphasis');
  82. var polygonGroups = fullData.getItemGraphicEl(fullIndex);
  83. var normalText = zrUtil.retrieve2(mapModel.getFormattedLabel(idx, 'normal'), name);
  84. var emphasisText = zrUtil.retrieve2(mapModel.getFormattedLabel(idx, 'emphasis'), normalText);
  85. var onEmphasis = function () {
  86. var hoverStyle = graphic.setTextStyle({}, hoverLabelModel, {
  87. text: hoverLabelModel.get('show') ? emphasisText : null
  88. }, {
  89. isRectText: true,
  90. useInsideStyle: false
  91. }, true);
  92. circle.style.extendFrom(hoverStyle); // Make label upper than others if overlaps.
  93. circle.__mapOriginalZ2 = circle.z2;
  94. circle.z2 += 1;
  95. };
  96. var onNormal = function () {
  97. graphic.setTextStyle(circle.style, labelModel, {
  98. text: labelModel.get('show') ? normalText : null,
  99. textPosition: labelModel.getShallow('position') || 'bottom'
  100. }, {
  101. isRectText: true,
  102. useInsideStyle: false
  103. });
  104. if (circle.__mapOriginalZ2 != null) {
  105. circle.z2 = circle.__mapOriginalZ2;
  106. circle.__mapOriginalZ2 = null;
  107. }
  108. };
  109. polygonGroups.on('mouseover', onEmphasis).on('mouseout', onNormal).on('emphasis', onEmphasis).on('normal', onNormal);
  110. onNormal();
  111. }
  112. group.add(circle);
  113. });
  114. }
  115. });
  116. module.exports = _default;