@antv/l7-layers 2.15.5 → 2.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/Geometry/index.js +31 -9
- package/es/Geometry/models/billboard.js +89 -51
- package/es/Geometry/models/plane.js +143 -81
- package/es/Geometry/models/sprite.js +118 -60
- package/es/canvas/index.js +33 -10
- package/es/canvas/models/canvas.js +97 -41
- package/es/citybuliding/building.js +27 -8
- package/es/citybuliding/models/build.js +82 -57
- package/es/core/BaseLayer.js +486 -321
- package/es/core/BaseModel.js +126 -97
- package/es/core/LayerPickService.js +32 -21
- package/es/core/TextureService.js +13 -0
- package/es/core/interface.js +24 -17
- package/es/core/shape/Path.js +20 -13
- package/es/core/shape/extrude.js +31 -10
- package/es/core/triangulation.js +114 -54
- package/es/earth/index.js +33 -9
- package/es/earth/models/atmosphere.js +54 -30
- package/es/earth/models/base.js +85 -47
- package/es/earth/models/bloomsphere.js +54 -30
- package/es/earth/utils.js +13 -9
- package/es/heatmap/index.js +40 -10
- package/es/heatmap/models/grid.js +52 -28
- package/es/heatmap/models/grid3d.js +52 -28
- package/es/heatmap/models/heatmap.js +146 -91
- package/es/heatmap/models/hexagon.js +52 -28
- package/es/heatmap/triangulation.js +4 -0
- package/es/image/index.js +28 -9
- package/es/image/models/image.js +100 -66
- package/es/index.js +17 -9
- package/es/line/index.js +34 -9
- package/es/line/models/arc.js +118 -66
- package/es/line/models/arc_3d.js +108 -60
- package/es/line/models/earthArc_3d.js +111 -63
- package/es/line/models/great_circle.js +100 -56
- package/es/line/models/half.js +77 -46
- package/es/line/models/line.js +148 -94
- package/es/line/models/linearline.js +80 -45
- package/es/line/models/simpleLine.js +74 -41
- package/es/line/models/wall.js +92 -52
- package/es/mask/index.js +28 -9
- package/es/mask/models/fill.js +54 -29
- package/es/plugins/DataMappingPlugin.js +117 -80
- package/es/plugins/DataSourcePlugin.js +68 -45
- package/es/plugins/FeatureScalePlugin.js +122 -67
- package/es/plugins/LayerAnimateStylePlugin.js +5 -0
- package/es/plugins/LayerMaskPlugin.js +11 -3
- package/es/plugins/LayerModelPlugin.js +104 -67
- package/es/plugins/LayerStylePlugin.js +9 -3
- package/es/plugins/LightingPlugin.js +18 -12
- package/es/plugins/MultiPassRendererPlugin.js +16 -11
- package/es/plugins/PixelPickingPlugin.js +21 -12
- package/es/plugins/RegisterStyleAttributePlugin.js +12 -5
- package/es/plugins/ShaderUniformPlugin.js +27 -13
- package/es/plugins/UpdateModelPlugin.js +5 -0
- package/es/plugins/UpdateStyleAttributePlugin.js +11 -5
- package/es/point/index.js +77 -26
- package/es/point/models/earthExtrude.js +102 -61
- package/es/point/models/earthFill.js +87 -57
- package/es/point/models/extrude.js +101 -60
- package/es/point/models/fill.js +100 -70
- package/es/point/models/fillmage.js +107 -63
- package/es/point/models/image.js +88 -48
- package/es/point/models/index.js +2 -2
- package/es/point/models/normal.js +54 -30
- package/es/point/models/radar.js +64 -40
- package/es/point/models/simplePoint.js +69 -41
- package/es/point/models/text.d.ts +2 -1
- package/es/point/models/text.js +305 -201
- package/es/point/shape/extrude.js +13 -4
- package/es/polygon/index.js +40 -11
- package/es/polygon/models/extrude.js +92 -48
- package/es/polygon/models/fill.js +88 -54
- package/es/polygon/models/index.js +2 -3
- package/es/polygon/models/ocean.js +76 -42
- package/es/polygon/models/water.js +71 -37
- package/es/raster/buffers/triangulation.js +4 -2
- package/es/raster/index.js +32 -9
- package/es/raster/models/raster.js +116 -80
- package/es/raster/models/rasterRgb.js +127 -84
- package/es/raster/models/rasterTerrainRgb.js +84 -56
- package/es/tile/interaction/getRasterData.js +20 -14
- package/es/tile/interaction/utils.js +9 -7
- package/es/tile/manager/base.js +96 -63
- package/es/tile/service/TileLayerService.js +55 -33
- package/es/tile/service/TilePickService.js +40 -26
- package/es/tile/service/TileSourceService.js +7 -3
- package/es/tile/tileFactory/DebugTile.js +46 -29
- package/es/tile/tileFactory/ImageTile.js +38 -20
- package/es/tile/tileFactory/MaskTile.js +43 -22
- package/es/tile/tileFactory/RasterRGBTile.js +42 -22
- package/es/tile/tileFactory/RasterTerrainRGBTile.js +38 -20
- package/es/tile/tileFactory/RasterTile.js +53 -30
- package/es/tile/tileFactory/Tile.js +97 -63
- package/es/tile/tileFactory/VectorTile.js +68 -41
- package/es/tile/tileFactory/index.js +11 -0
- package/es/tile/tileFactory/layers/TileDebugLayer.js +27 -6
- package/es/tile/tileFactory/util.js +3 -0
- package/es/tile/tileLayer/BaseLayer.js +146 -105
- package/es/tile/utils.js +1 -1
- package/es/utils/blend.js +2 -0
- package/es/utils/collision-index.js +16 -9
- package/es/utils/dataMappingStyle.js +18 -8
- package/es/utils/extrude_polyline.js +149 -101
- package/es/utils/grid-index.js +27 -2
- package/es/utils/identityScale.js +8 -0
- package/es/utils/layerData.js +44 -30
- package/es/utils/multiPassRender.js +13 -11
- package/es/utils/polylineNormal.js +37 -31
- package/es/utils/simpleLine.js +16 -2
- package/es/utils/stencil.js +3 -2
- package/es/utils/symbol-layout.js +53 -27
- package/es/wind/index.js +29 -9
- package/es/wind/models/utils.js +51 -26
- package/es/wind/models/wind.js +147 -101
- package/es/wind/models/windRender.js +66 -53
- package/lib/Geometry/index.js +38 -9
- package/lib/Geometry/models/billboard.js +97 -51
- package/lib/Geometry/models/index.js +5 -0
- package/lib/Geometry/models/plane.js +151 -79
- package/lib/Geometry/models/sprite.js +127 -60
- package/lib/canvas/index.js +40 -10
- package/lib/canvas/models/canvas.js +101 -41
- package/lib/canvas/models/index.js +3 -0
- package/lib/citybuliding/building.js +35 -8
- package/lib/citybuliding/models/build.js +92 -57
- package/lib/core/BaseLayer.js +480 -321
- package/lib/core/BaseModel.js +139 -97
- package/lib/core/LayerPickService.js +37 -21
- package/lib/core/TextureService.js +16 -0
- package/lib/core/interface.js +31 -21
- package/lib/core/schema.js +1 -0
- package/lib/core/shape/Path.js +31 -14
- package/lib/core/shape/extrude.js +54 -10
- package/lib/core/triangulation.js +153 -53
- package/lib/earth/index.js +43 -9
- package/lib/earth/models/atmosphere.js +63 -30
- package/lib/earth/models/base.js +90 -47
- package/lib/earth/models/bloomsphere.js +63 -30
- package/lib/earth/utils.js +31 -7
- package/lib/heatmap/index.js +48 -10
- package/lib/heatmap/models/grid.js +60 -28
- package/lib/heatmap/models/grid3d.js +60 -28
- package/lib/heatmap/models/heatmap.js +162 -91
- package/lib/heatmap/models/hexagon.js +60 -28
- package/lib/heatmap/models/index.js +6 -0
- package/lib/heatmap/triangulation.js +5 -0
- package/lib/image/index.js +36 -9
- package/lib/image/models/image.js +109 -66
- package/lib/image/models/index.js +3 -0
- package/lib/index.js +61 -7
- package/lib/line/index.js +40 -9
- package/lib/line/models/arc.js +128 -64
- package/lib/line/models/arc_3d.js +119 -58
- package/lib/line/models/earthArc_3d.js +122 -61
- package/lib/line/models/great_circle.js +111 -56
- package/lib/line/models/half.js +87 -46
- package/lib/line/models/index.js +11 -0
- package/lib/line/models/line.js +156 -92
- package/lib/line/models/linearline.js +92 -45
- package/lib/line/models/simpleLine.js +84 -41
- package/lib/line/models/wall.js +103 -52
- package/lib/mask/index.js +36 -9
- package/lib/mask/models/fill.js +63 -29
- package/lib/mask/models/index.js +3 -0
- package/lib/plugins/DataMappingPlugin.js +128 -80
- package/lib/plugins/DataSourcePlugin.js +76 -45
- package/lib/plugins/FeatureScalePlugin.js +138 -67
- package/lib/plugins/LayerAnimateStylePlugin.js +10 -0
- package/lib/plugins/LayerMaskPlugin.js +17 -4
- package/lib/plugins/LayerModelPlugin.js +113 -68
- package/lib/plugins/LayerStylePlugin.js +14 -4
- package/lib/plugins/LightingPlugin.js +25 -12
- package/lib/plugins/MultiPassRendererPlugin.js +22 -11
- package/lib/plugins/PixelPickingPlugin.js +27 -12
- package/lib/plugins/RegisterStyleAttributePlugin.js +19 -5
- package/lib/plugins/ShaderUniformPlugin.js +34 -13
- package/lib/plugins/UpdateModelPlugin.js +10 -1
- package/lib/plugins/UpdateStyleAttributePlugin.js +16 -5
- package/lib/point/index.js +83 -26
- package/lib/point/models/earthExtrude.js +113 -61
- package/lib/point/models/earthFill.js +117 -57
- package/lib/point/models/extrude.js +111 -60
- package/lib/point/models/fill.js +109 -68
- package/lib/point/models/fillmage.js +115 -61
- package/lib/point/models/image.js +98 -48
- package/lib/point/models/index.js +12 -1
- package/lib/point/models/normal.js +64 -30
- package/lib/point/models/radar.js +74 -40
- package/lib/point/models/simplePoint.js +79 -41
- package/lib/point/models/text.js +314 -202
- package/lib/point/shape/extrude.js +20 -4
- package/lib/polygon/index.js +48 -11
- package/lib/polygon/models/extrude.js +103 -48
- package/lib/polygon/models/fill.js +98 -54
- package/lib/polygon/models/index.js +14 -2
- package/lib/polygon/models/ocean.js +88 -42
- package/lib/polygon/models/water.js +82 -37
- package/lib/raster/buffers/triangulation.js +7 -3
- package/lib/raster/index.js +40 -9
- package/lib/raster/models/index.js +5 -0
- package/lib/raster/models/raster.js +125 -80
- package/lib/raster/models/rasterRgb.js +139 -84
- package/lib/raster/models/rasterTerrainRgb.js +93 -56
- package/lib/tile/interaction/getRasterData.js +25 -14
- package/lib/tile/interaction/utils.js +19 -7
- package/lib/tile/manager/base.js +104 -63
- package/lib/tile/service/TileLayerService.js +60 -33
- package/lib/tile/service/TilePickService.js +48 -26
- package/lib/tile/service/TileSourceService.js +16 -2
- package/lib/tile/style/utils.js +3 -0
- package/lib/tile/tileFactory/DebugTile.js +54 -29
- package/lib/tile/tileFactory/ImageTile.js +46 -20
- package/lib/tile/tileFactory/MaskTile.js +51 -22
- package/lib/tile/tileFactory/RasterRGBTile.js +50 -22
- package/lib/tile/tileFactory/RasterTerrainRGBTile.js +46 -20
- package/lib/tile/tileFactory/RasterTile.js +63 -30
- package/lib/tile/tileFactory/Tile.js +102 -63
- package/lib/tile/tileFactory/VectorTile.js +76 -41
- package/lib/tile/tileFactory/index.js +25 -0
- package/lib/tile/tileFactory/layers/TileDebugLayer.js +32 -6
- package/lib/tile/tileFactory/util.js +9 -0
- package/lib/tile/tileLayer/BaseLayer.js +153 -105
- package/lib/tile/utils.js +5 -1
- package/lib/utils/blend.js +5 -0
- package/lib/utils/collision-index.js +25 -9
- package/lib/utils/dataMappingStyle.js +19 -8
- package/lib/utils/extrude_polyline.js +181 -101
- package/lib/utils/grid-index.js +28 -2
- package/lib/utils/identityScale.js +9 -0
- package/lib/utils/layerData.js +49 -30
- package/lib/utils/multiPassRender.js +16 -11
- package/lib/utils/polylineNormal.js +66 -31
- package/lib/utils/simpleLine.js +21 -2
- package/lib/utils/stencil.js +4 -0
- package/lib/utils/symbol-layout.js +55 -27
- package/lib/wind/index.js +37 -9
- package/lib/wind/models/index.js +3 -0
- package/lib/wind/models/utils.js +62 -26
- package/lib/wind/models/wind.js +157 -101
- package/lib/wind/models/windRender.js +71 -53
- package/lib/wind/models/windShader.js +1 -0
- package/package.json +7 -7
package/es/point/models/text.js
CHANGED
|
@@ -7,28 +7,38 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConst
|
|
|
7
7
|
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
|
|
8
8
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
9
9
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
10
|
+
|
|
10
11
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
12
|
+
|
|
11
13
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
12
|
-
|
|
14
|
+
|
|
15
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
16
|
+
|
|
13
17
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
18
|
+
|
|
14
19
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
20
|
+
|
|
15
21
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
22
|
+
|
|
16
23
|
import { AttributeType, gl } from '@antv/l7-core';
|
|
17
24
|
import { boundsContains, calculateCentroid, padBounds } from '@antv/l7-utils';
|
|
18
25
|
import { isEqual, isNumber } from 'lodash';
|
|
19
26
|
import BaseModel from "../../core/BaseModel";
|
|
20
27
|
import CollisionIndex from "../../utils/collision-index";
|
|
21
28
|
import { getGlyphQuads, shapeText } from "../../utils/symbol-layout";
|
|
29
|
+
|
|
22
30
|
/* babel-plugin-inline-import '../shaders/text_frag.glsl' */
|
|
23
31
|
var textFrag = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 48.0\nuniform sampler2D u_sdf_map;\nuniform float u_gamma_scale : 0.5;\n// uniform float u_font_size : 24.0;\nuniform float u_opacity : 1.0;\nuniform vec4 u_stroke_color : [0, 0, 0, 1];\nuniform float u_stroke_width : 2.0;\nuniform float u_halo_blur : 0.5;\nuniform float u_DevicePixelRatio;\n\nvarying vec4 v_color;\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying float v_fontScale;\n\nvarying mat4 styleMappingMat; // \u4F20\u9012\u4ECE\u7247\u5143\u4E2D\u4F20\u9012\u7684\u6620\u5C04\u6570\u636E\n\n#pragma include \"picking\"\nvoid main() {\n // get style data mapping\n float opacity = styleMappingMat[0][0];\n float strokeWidth = styleMappingMat[0][2];\n vec4 textrueStroke = vec4(\n styleMappingMat[1][0],\n styleMappingMat[1][1],\n styleMappingMat[1][2],\n styleMappingMat[1][3]\n );\n\n // get sdf from atlas\n float dist = texture2D(u_sdf_map, v_uv).a;\n\n // float fontScale = u_font_size / FONT_SIZE;\n\n // lowp float buff = (6.0 - u_stroke_width / v_fontScale) / SDF_PX;\n lowp float buff = (6.0 - strokeWidth / v_fontScale) / SDF_PX;\n highp float gamma = (u_halo_blur * 1.19 / SDF_PX + EDGE_GAMMA) / (v_fontScale * u_gamma_scale) / 1.0;\n\n highp float gamma_scaled = gamma * v_gamma_scale;\n\n highp float alpha = smoothstep(buff - gamma_scaled, buff + gamma_scaled, dist);\n // gl_FragColor = mix(vec4(v_color.rgb, v_color.a * u_opacity), vec4(u_stroke_color.rgb, u_stroke_color.a * u_opacity), smoothstep(0., 0.5, 1. - dist));\n gl_FragColor = mix(vec4(v_color.rgb, v_color.a * opacity), vec4(textrueStroke.rgb, textrueStroke.a * opacity), smoothstep(0., 0.5, 1. - dist));\n gl_FragColor.a= gl_FragColor.a * alpha;\n // \u4F5C\u4E3A mask \u6A21\u677F\u65F6\u9700\u8981\u4E22\u5F03\u900F\u660E\u7684\u50CF\u7D20\n if (gl_FragColor.a < 0.01) {\n discard;\n }\n gl_FragColor = filterColor(gl_FragColor);\n}\n";
|
|
32
|
+
|
|
24
33
|
/* babel-plugin-inline-import '../shaders/text_vert.glsl' */
|
|
25
34
|
var textVert = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 24.0\nattribute vec3 a_Position;\nattribute vec2 a_tex;\nattribute vec2 a_textOffsets;\nattribute vec4 a_Color;\nattribute float a_Size;\nattribute float a_Rotate;\n\nuniform vec2 u_sdf_map_size;\nuniform mat4 u_ModelMatrix;\nuniform mat4 u_Mvp;\nuniform float u_raisingHeight: 0.0;\n\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying vec4 v_color;\nvarying float v_fontScale;\n\nvarying mat4 styleMappingMat; // \u7528\u4E8E\u5C06\u5728\u9876\u70B9\u7740\u8272\u5668\u4E2D\u8BA1\u7B97\u597D\u7684\u6837\u5F0F\u503C\u4F20\u9012\u7ED9\u7247\u5143\n\nuniform float u_opacity : 1;\nuniform float u_stroke_width : 2;\nuniform vec4 u_stroke_color : [0.0, 0.0, 0.0, 0.0];\n\n#pragma include \"styleMapping\"\n#pragma include \"styleMappingCalOpacity\"\n#pragma include \"styleMappingCalStrokeWidth\"\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n\nvoid main() {\n // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n styleMappingMat = mat4(\n 0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - empty\n 0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA\n 0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1]\n 0.0, 0.0, 0.0, 0.0\n );\n\n float rowCount = u_cellTypeLayout[0][0]; // \u5F53\u524D\u7684\u6570\u636E\u7EB9\u7406\u6709\u51E0\u884C\n float columnCount = u_cellTypeLayout[0][1]; // \u5F53\u770B\u5230\u6570\u636E\u7EB9\u7406\u6709\u51E0\u5217\n float columnWidth = 1.0/columnCount; // \u5217\u5BBD\n float rowHeight = 1.0/rowCount; // \u884C\u9AD8\n float cellCount = calCellCount(); // opacity - strokeOpacity - strokeWidth - stroke - offsets\n float id = a_vertexId; // \u7B2Cn\u4E2A\u9876\u70B9\n float cellCurrentRow = floor(id * cellCount / columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u884C\n float cellCurrentColumn = mod(id * cellCount, columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u5217\n \n // cell \u56FA\u5B9A\u987A\u5E8F opacity -> strokeOpacity -> strokeWidth -> stroke ... \n // \u6309\u987A\u5E8F\u4ECE cell \u4E2D\u53D6\u503C\u3001\u82E5\u6CA1\u6709\u5219\u81EA\u52A8\u5F80\u4E0B\u53D6\u503C\n float textureOffset = 0.0; // \u5728 cell \u4E2D\u53D6\u503C\u7684\u504F\u79FB\u91CF\n\n vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);\n styleMappingMat[0][0] = opacityAndOffset.r;\n textureOffset = opacityAndOffset.g;\n\n vec2 strokeWidthAndOffset = calStrokeWidthAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);\n styleMappingMat[0][2] = strokeWidthAndOffset.r;\n textureOffset = strokeWidthAndOffset.g;\n\n vec4 textrueStroke = vec4(-1.0, -1.0, -1.0, -1.0);\n if(hasStroke()) {\n vec2 valueRPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n styleMappingMat[1][0] = pos2value(valueRPos, columnWidth, rowHeight); // R\n textureOffset += 1.0;\n\n vec2 valueGPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n styleMappingMat[1][1] = pos2value(valueGPos, columnWidth, rowHeight); // G\n textureOffset += 1.0;\n\n vec2 valueBPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n styleMappingMat[1][2] = pos2value(valueBPos, columnWidth, rowHeight); // B\n textureOffset += 1.0;\n\n vec2 valueAPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n styleMappingMat[1][3] = pos2value(valueAPos, columnWidth, rowHeight); // A\n textureOffset += 1.0;\n } else {\n if(u_stroke_color == vec4(0.0)) {\n styleMappingMat[1][0] = v_color.r;\n styleMappingMat[1][1] = v_color.g;\n styleMappingMat[1][2] = v_color.b;\n styleMappingMat[1][3] = v_color.a;\n } else {\n styleMappingMat[1][0] = u_stroke_color.r;\n styleMappingMat[1][1] = u_stroke_color.g;\n styleMappingMat[1][2] = u_stroke_color.b;\n styleMappingMat[1][3] = u_stroke_color.a;\n }\n }\n \n // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n\n v_color = a_Color;\n v_uv = a_tex / u_sdf_map_size;\n\n // \u6587\u672C\u7F29\u653E\u6BD4\u4F8B\n float fontScale = a_Size / FONT_SIZE;\n v_fontScale = fontScale;\n\n vec4 project_pos = project_position(vec4(a_Position, 1.0));\n // vec4 projected_position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n\n highp float angle_sin = sin(a_Rotate);\n highp float angle_cos = cos(a_Rotate);\n mat2 rotation_matrix = mat2(angle_cos, -1.0 * angle_sin, angle_sin, angle_cos);\n \n // gl_Position = vec4(projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n\n float raiseHeight = u_raisingHeight;\n if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {\n float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);\n raiseHeight = u_raisingHeight * mapboxZoomScale;\n }\n\n vec4 projected_position;\n if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n projected_position = u_Mvp *(vec4(a_Position.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n } else { // else\n projected_position = project_common_position_to_clipspace(vec4(project_pos.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n }\n\n gl_Position = vec4(\n projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n v_gamma_scale = gl_Position.w;\n setPickingColor(a_PickingColor);\n\n}\n";
|
|
26
|
-
export function
|
|
35
|
+
export function TextTrianglation(feature) {
|
|
27
36
|
// @ts-ignore
|
|
28
37
|
var that = this;
|
|
29
38
|
var id = feature.id;
|
|
30
39
|
var vertices = [];
|
|
31
40
|
var indices = [];
|
|
41
|
+
|
|
32
42
|
if (!that.glyphInfoMap || !that.glyphInfoMap[id]) {
|
|
33
43
|
return {
|
|
34
44
|
vertices: [],
|
|
@@ -37,7 +47,9 @@ export function TextTriangulation(feature) {
|
|
|
37
47
|
size: 7
|
|
38
48
|
};
|
|
39
49
|
}
|
|
50
|
+
|
|
40
51
|
var centroid = that.glyphInfoMap[id].centroid; // 计算中心点
|
|
52
|
+
|
|
41
53
|
var coord = centroid.length === 2 ? [centroid[0], centroid[1], 0] : centroid;
|
|
42
54
|
that.glyphInfoMap[id].glyphQuads.forEach(function (quad, index) {
|
|
43
55
|
vertices.push.apply(vertices, _toConsumableArray(coord).concat([quad.tex.x, quad.tex.y + quad.tex.height, quad.tl.x, quad.tl.y], _toConsumableArray(coord), [quad.tex.x + quad.tex.width, quad.tex.y + quad.tex.height, quad.tr.x, quad.tr.y], _toConsumableArray(coord), [quad.tex.x + quad.tex.width, quad.tex.y, quad.br.x, quad.br.y], _toConsumableArray(coord), [quad.tex.x, quad.tex.y, quad.bl.x, quad.bl.y]));
|
|
@@ -50,60 +62,84 @@ export function TextTriangulation(feature) {
|
|
|
50
62
|
size: 7
|
|
51
63
|
};
|
|
52
64
|
}
|
|
65
|
+
|
|
53
66
|
var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
54
67
|
_inherits(TextModel, _BaseModel);
|
|
68
|
+
|
|
55
69
|
var _super = _createSuper(TextModel);
|
|
70
|
+
|
|
56
71
|
function TextModel() {
|
|
57
72
|
var _this;
|
|
73
|
+
|
|
58
74
|
_classCallCheck(this, TextModel);
|
|
75
|
+
|
|
59
76
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
60
77
|
args[_key] = arguments[_key];
|
|
61
78
|
}
|
|
79
|
+
|
|
62
80
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
81
|
+
|
|
63
82
|
_defineProperty(_assertThisInitialized(_this), "glyphInfoMap", {});
|
|
83
|
+
|
|
64
84
|
_defineProperty(_assertThisInitialized(_this), "currentZoom", -1);
|
|
85
|
+
|
|
65
86
|
_defineProperty(_assertThisInitialized(_this), "textureHeight", 0);
|
|
87
|
+
|
|
66
88
|
_defineProperty(_assertThisInitialized(_this), "textCount", 0);
|
|
89
|
+
|
|
67
90
|
_defineProperty(_assertThisInitialized(_this), "preTextStyle", {});
|
|
91
|
+
|
|
68
92
|
_defineProperty(_assertThisInitialized(_this), "mapping", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
69
93
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
70
|
-
while (1)
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
94
|
+
while (1) {
|
|
95
|
+
switch (_context.prev = _context.next) {
|
|
96
|
+
case 0:
|
|
97
|
+
_this.initGlyph(); //
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
_this.updateTexture();
|
|
101
|
+
|
|
102
|
+
_context.next = 4;
|
|
103
|
+
return _this.reBuildModel();
|
|
104
|
+
|
|
105
|
+
case 4:
|
|
106
|
+
case "end":
|
|
107
|
+
return _context.stop();
|
|
108
|
+
}
|
|
79
109
|
}
|
|
80
110
|
}, _callee);
|
|
81
111
|
})));
|
|
112
|
+
|
|
82
113
|
return _this;
|
|
83
114
|
}
|
|
115
|
+
|
|
84
116
|
_createClass(TextModel, [{
|
|
85
117
|
key: "getUninforms",
|
|
86
118
|
value: function getUninforms() {
|
|
87
119
|
var _ref2 = this.layer.getLayerConfig(),
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
120
|
+
_ref2$opacity = _ref2.opacity,
|
|
121
|
+
opacity = _ref2$opacity === void 0 ? 1.0 : _ref2$opacity,
|
|
122
|
+
_ref2$stroke = _ref2.stroke,
|
|
123
|
+
stroke = _ref2$stroke === void 0 ? '#fff' : _ref2$stroke,
|
|
124
|
+
_ref2$strokeWidth = _ref2.strokeWidth,
|
|
125
|
+
strokeWidth = _ref2$strokeWidth === void 0 ? 0 : _ref2$strokeWidth,
|
|
126
|
+
_ref2$halo = _ref2.halo,
|
|
127
|
+
halo = _ref2$halo === void 0 ? 0.5 : _ref2$halo,
|
|
128
|
+
_ref2$gamma = _ref2.gamma,
|
|
129
|
+
gamma = _ref2$gamma === void 0 ? 2.0 : _ref2$gamma,
|
|
130
|
+
_ref2$raisingHeight = _ref2.raisingHeight,
|
|
131
|
+
raisingHeight = _ref2$raisingHeight === void 0 ? 0 : _ref2$raisingHeight;
|
|
132
|
+
|
|
100
133
|
var mapping = this.getFontServiceMapping();
|
|
101
134
|
var canvas = this.getFontServiceCanvas();
|
|
135
|
+
|
|
102
136
|
if (mapping && Object.keys(mapping).length !== this.textCount && canvas) {
|
|
103
137
|
this.updateTexture();
|
|
104
138
|
this.textCount = Object.keys(mapping).length;
|
|
105
139
|
}
|
|
140
|
+
|
|
106
141
|
this.preTextStyle = this.getTextStyle();
|
|
142
|
+
|
|
107
143
|
if (this.dataTextureTest && this.dataTextureNeedUpdate({
|
|
108
144
|
opacity: opacity,
|
|
109
145
|
strokeWidth: strokeWidth,
|
|
@@ -115,11 +151,14 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
115
151
|
stroke: stroke
|
|
116
152
|
});
|
|
117
153
|
var encodeData = this.layer.getEncodedData();
|
|
154
|
+
|
|
118
155
|
var _this$calDataFrame = this.calDataFrame(this.cellLength, encodeData, this.cellProperties),
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
156
|
+
data = _this$calDataFrame.data,
|
|
157
|
+
width = _this$calDataFrame.width,
|
|
158
|
+
height = _this$calDataFrame.height;
|
|
159
|
+
|
|
122
160
|
this.rowCount = height; // 当前数据纹理有多少行
|
|
161
|
+
|
|
123
162
|
this.dataTexture = this.cellLength > 0 && data.length > 0 ? this.createTexture2D({
|
|
124
163
|
flipY: true,
|
|
125
164
|
data: data,
|
|
@@ -136,6 +175,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
136
175
|
height: 1
|
|
137
176
|
});
|
|
138
177
|
}
|
|
178
|
+
|
|
139
179
|
return {
|
|
140
180
|
u_dataTexture: this.dataTexture,
|
|
141
181
|
// 数据纹理 - 有数据映射的时候纹理中带数据,若没有任何数据映射时纹理是 [1]
|
|
@@ -155,22 +195,28 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
155
195
|
value: function () {
|
|
156
196
|
var _initModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
157
197
|
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
158
|
-
while (1)
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
198
|
+
while (1) {
|
|
199
|
+
switch (_context2.prev = _context2.next) {
|
|
200
|
+
case 0:
|
|
201
|
+
// 绑定事件
|
|
202
|
+
this.bindEvent();
|
|
203
|
+
this.extent = this.textExtent();
|
|
204
|
+
this.rawEncodeData = this.layer.getEncodedData();
|
|
205
|
+
this.preTextStyle = this.getTextStyle();
|
|
206
|
+
return _context2.abrupt("return", this.buildModels());
|
|
207
|
+
|
|
208
|
+
case 5:
|
|
209
|
+
case "end":
|
|
210
|
+
return _context2.stop();
|
|
211
|
+
}
|
|
168
212
|
}
|
|
169
213
|
}, _callee2, this);
|
|
170
214
|
}));
|
|
215
|
+
|
|
171
216
|
function initModels() {
|
|
172
217
|
return _initModels.apply(this, arguments);
|
|
173
218
|
}
|
|
219
|
+
|
|
174
220
|
return initModels;
|
|
175
221
|
}()
|
|
176
222
|
}, {
|
|
@@ -178,37 +224,48 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
178
224
|
value: function () {
|
|
179
225
|
var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
|
|
180
226
|
var _ref3, _ref3$textAllowOverla, textAllowOverlap, model;
|
|
227
|
+
|
|
181
228
|
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
|
182
|
-
while (1)
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
vertexShader: textVert,
|
|
194
|
-
fragmentShader: textFrag,
|
|
195
|
-
triangulation: TextTriangulation.bind(this),
|
|
196
|
-
depth: {
|
|
197
|
-
enable: false
|
|
229
|
+
while (1) {
|
|
230
|
+
switch (_context3.prev = _context3.next) {
|
|
231
|
+
case 0:
|
|
232
|
+
_ref3 = this.layer.getLayerConfig(), _ref3$textAllowOverla = _ref3.textAllowOverlap, textAllowOverlap = _ref3$textAllowOverla === void 0 ? false : _ref3$textAllowOverla; // this.mapping(); 重复调用
|
|
233
|
+
|
|
234
|
+
this.initGlyph(); //
|
|
235
|
+
|
|
236
|
+
this.updateTexture();
|
|
237
|
+
|
|
238
|
+
if (!textAllowOverlap) {
|
|
239
|
+
this.filterGlyphs();
|
|
198
240
|
}
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
241
|
+
|
|
242
|
+
_context3.next = 6;
|
|
243
|
+
return this.layer.buildLayerModel({
|
|
244
|
+
moduleName: 'pointText',
|
|
245
|
+
vertexShader: textVert,
|
|
246
|
+
fragmentShader: textFrag,
|
|
247
|
+
triangulation: TextTrianglation.bind(this),
|
|
248
|
+
depth: {
|
|
249
|
+
enable: false
|
|
250
|
+
}
|
|
251
|
+
});
|
|
252
|
+
|
|
253
|
+
case 6:
|
|
254
|
+
model = _context3.sent;
|
|
255
|
+
return _context3.abrupt("return", [model]);
|
|
256
|
+
|
|
257
|
+
case 8:
|
|
258
|
+
case "end":
|
|
259
|
+
return _context3.stop();
|
|
260
|
+
}
|
|
206
261
|
}
|
|
207
262
|
}, _callee3, this);
|
|
208
263
|
}));
|
|
264
|
+
|
|
209
265
|
function buildModels() {
|
|
210
266
|
return _buildModels.apply(this, arguments);
|
|
211
267
|
}
|
|
268
|
+
|
|
212
269
|
return buildModels;
|
|
213
270
|
}() // 需要更新的场景
|
|
214
271
|
// 1. 文本偏移量发生改变
|
|
@@ -216,62 +273,80 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
216
273
|
// 3. 文本允许重叠发生改变
|
|
217
274
|
// 4. 文本字体发生改变
|
|
218
275
|
// 5. 文本字体粗细发生改变
|
|
276
|
+
|
|
219
277
|
}, {
|
|
220
278
|
key: "needUpdate",
|
|
221
279
|
value: function () {
|
|
222
280
|
var _needUpdate = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
|
|
223
281
|
var _ref4, _ref4$textAllowOverla, textAllowOverlap, _ref4$textAnchor, textAnchor, textOffset, padding, fontFamily, fontWeight, zoom, extent, flag;
|
|
282
|
+
|
|
224
283
|
return _regeneratorRuntime.wrap(function _callee4$(_context4) {
|
|
225
|
-
while (1)
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
284
|
+
while (1) {
|
|
285
|
+
switch (_context4.prev = _context4.next) {
|
|
286
|
+
case 0:
|
|
287
|
+
_ref4 = this.getTextStyle(), _ref4$textAllowOverla = _ref4.textAllowOverlap, textAllowOverlap = _ref4$textAllowOverla === void 0 ? false : _ref4$textAllowOverla, _ref4$textAnchor = _ref4.textAnchor, textAnchor = _ref4$textAnchor === void 0 ? 'center' : _ref4$textAnchor, textOffset = _ref4.textOffset, padding = _ref4.padding, fontFamily = _ref4.fontFamily, fontWeight = _ref4.fontWeight;
|
|
288
|
+
|
|
289
|
+
if (!(!isEqual(padding, this.preTextStyle.padding) || !isEqual(textOffset, this.preTextStyle.textOffset) || !isEqual(textAnchor, this.preTextStyle.textAnchor) || !isEqual(fontFamily, this.preTextStyle.fontFamily) || !isEqual(fontWeight, this.preTextStyle.fontWeight))) {
|
|
290
|
+
_context4.next = 5;
|
|
291
|
+
break;
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
_context4.next = 4;
|
|
295
|
+
return this.mapping();
|
|
296
|
+
|
|
297
|
+
case 4:
|
|
298
|
+
return _context4.abrupt("return", true);
|
|
299
|
+
|
|
300
|
+
case 5:
|
|
301
|
+
if (!textAllowOverlap) {
|
|
302
|
+
_context4.next = 7;
|
|
303
|
+
break;
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
return _context4.abrupt("return", false);
|
|
307
|
+
|
|
308
|
+
case 7:
|
|
309
|
+
// textAllowOverlap 发生改变
|
|
310
|
+
zoom = this.mapService.getZoom();
|
|
311
|
+
extent = this.mapService.getBounds();
|
|
312
|
+
flag = boundsContains(this.extent, extent); // 文本不能压盖则进行过滤
|
|
313
|
+
|
|
314
|
+
if (!(Math.abs(this.currentZoom - zoom) > 0.5 || !flag || textAllowOverlap !== this.preTextStyle.textAllowOverlap)) {
|
|
315
|
+
_context4.next = 14;
|
|
316
|
+
break;
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
_context4.next = 13;
|
|
320
|
+
return this.reBuildModel();
|
|
321
|
+
|
|
322
|
+
case 13:
|
|
323
|
+
return _context4.abrupt("return", true);
|
|
324
|
+
|
|
325
|
+
case 14:
|
|
326
|
+
return _context4.abrupt("return", false);
|
|
327
|
+
|
|
328
|
+
case 15:
|
|
329
|
+
case "end":
|
|
330
|
+
return _context4.stop();
|
|
331
|
+
}
|
|
260
332
|
}
|
|
261
333
|
}, _callee4, this);
|
|
262
334
|
}));
|
|
335
|
+
|
|
263
336
|
function needUpdate() {
|
|
264
337
|
return _needUpdate.apply(this, arguments);
|
|
265
338
|
}
|
|
339
|
+
|
|
266
340
|
return needUpdate;
|
|
267
341
|
}()
|
|
268
342
|
}, {
|
|
269
343
|
key: "clearModels",
|
|
270
344
|
value: function clearModels() {
|
|
271
345
|
var _this$texture, _this$dataTexture;
|
|
346
|
+
|
|
272
347
|
(_this$texture = this.texture) === null || _this$texture === void 0 ? void 0 : _this$texture.destroy();
|
|
273
|
-
(_this$dataTexture = this.dataTexture) === null || _this$dataTexture === void 0 ? void 0 : _this$dataTexture.destroy();
|
|
274
|
-
|
|
348
|
+
(_this$dataTexture = this.dataTexture) === null || _this$dataTexture === void 0 ? void 0 : _this$dataTexture.destroy(); // TODO this.mapping
|
|
349
|
+
|
|
275
350
|
this.layer.off('remapping', this.mapping);
|
|
276
351
|
}
|
|
277
352
|
}, {
|
|
@@ -290,7 +365,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
290
365
|
size: 1,
|
|
291
366
|
update: function update(feature) {
|
|
292
367
|
var _feature$rotate = feature.rotate,
|
|
293
|
-
|
|
368
|
+
rotate = _feature$rotate === void 0 ? 0 : _feature$rotate;
|
|
294
369
|
return Array.isArray(rotate) ? [rotate[0]] : [rotate];
|
|
295
370
|
}
|
|
296
371
|
}
|
|
@@ -311,9 +386,8 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
311
386
|
return [vertex[5], vertex[6]];
|
|
312
387
|
}
|
|
313
388
|
}
|
|
314
|
-
});
|
|
389
|
+
}); // point layer size;
|
|
315
390
|
|
|
316
|
-
// point layer size;
|
|
317
391
|
this.styleAttributeService.registerStyleAttribute({
|
|
318
392
|
name: 'size',
|
|
319
393
|
type: AttributeType.Attribute,
|
|
@@ -328,7 +402,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
328
402
|
size: 1,
|
|
329
403
|
update: function update(feature) {
|
|
330
404
|
var _feature$size = feature.size,
|
|
331
|
-
|
|
405
|
+
size = _feature$size === void 0 ? 12 : _feature$size;
|
|
332
406
|
return Array.isArray(size) ? [size[0]] : [size];
|
|
333
407
|
}
|
|
334
408
|
}
|
|
@@ -367,23 +441,28 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
367
441
|
/**
|
|
368
442
|
* 生成文字纹理(生成文字纹理字典)
|
|
369
443
|
*/
|
|
444
|
+
|
|
370
445
|
}, {
|
|
371
446
|
key: "initTextFont",
|
|
372
447
|
value: function initTextFont() {
|
|
373
448
|
var _this$getTextStyle = this.getTextStyle(),
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
449
|
+
fontWeight = _this$getTextStyle.fontWeight,
|
|
450
|
+
fontFamily = _this$getTextStyle.fontFamily;
|
|
451
|
+
|
|
452
|
+
var data = this.rawEncodeData;
|
|
377
453
|
var characterSet = [];
|
|
378
454
|
data.forEach(function (item) {
|
|
379
455
|
var _item$shape = item.shape,
|
|
380
|
-
|
|
456
|
+
shape = _item$shape === void 0 ? '' : _item$shape;
|
|
381
457
|
shape = shape.toString();
|
|
458
|
+
|
|
382
459
|
var _iterator = _createForOfIteratorHelper(shape),
|
|
383
|
-
|
|
460
|
+
_step;
|
|
461
|
+
|
|
384
462
|
try {
|
|
385
463
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
386
464
|
var char = _step.value;
|
|
465
|
+
|
|
387
466
|
// 去重
|
|
388
467
|
if (characterSet.indexOf(char) === -1) {
|
|
389
468
|
characterSet.push(char);
|
|
@@ -402,22 +481,24 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
402
481
|
iconfont: false
|
|
403
482
|
});
|
|
404
483
|
}
|
|
405
|
-
|
|
406
484
|
/**
|
|
407
485
|
* 生成 iconfont 纹理字典
|
|
408
486
|
*/
|
|
487
|
+
|
|
409
488
|
}, {
|
|
410
489
|
key: "initIconFontTex",
|
|
411
490
|
value: function initIconFontTex() {
|
|
412
491
|
var _this$getTextStyle2 = this.getTextStyle(),
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
492
|
+
fontWeight = _this$getTextStyle2.fontWeight,
|
|
493
|
+
fontFamily = _this$getTextStyle2.fontFamily;
|
|
494
|
+
|
|
495
|
+
var data = this.rawEncodeData;
|
|
416
496
|
var characterSet = [];
|
|
417
497
|
data.forEach(function (item) {
|
|
418
498
|
var _item$shape2 = item.shape,
|
|
419
|
-
|
|
499
|
+
shape = _item$shape2 === void 0 ? '' : _item$shape2;
|
|
420
500
|
shape = "".concat(shape);
|
|
501
|
+
|
|
421
502
|
if (characterSet.indexOf(shape) === -1) {
|
|
422
503
|
characterSet.push(shape);
|
|
423
504
|
}
|
|
@@ -433,26 +514,27 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
433
514
|
key: "getTextStyle",
|
|
434
515
|
value: function getTextStyle() {
|
|
435
516
|
var _ref5 = this.layer.getLayerConfig(),
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
517
|
+
_ref5$fontWeight = _ref5.fontWeight,
|
|
518
|
+
fontWeight = _ref5$fontWeight === void 0 ? '400' : _ref5$fontWeight,
|
|
519
|
+
_ref5$fontFamily = _ref5.fontFamily,
|
|
520
|
+
fontFamily = _ref5$fontFamily === void 0 ? 'sans-serif' : _ref5$fontFamily,
|
|
521
|
+
_ref5$textAllowOverla = _ref5.textAllowOverlap,
|
|
522
|
+
textAllowOverlap = _ref5$textAllowOverla === void 0 ? false : _ref5$textAllowOverla,
|
|
523
|
+
_ref5$padding = _ref5.padding,
|
|
524
|
+
padding = _ref5$padding === void 0 ? [0, 0] : _ref5$padding,
|
|
525
|
+
_ref5$textAnchor = _ref5.textAnchor,
|
|
526
|
+
textAnchor = _ref5$textAnchor === void 0 ? 'center' : _ref5$textAnchor,
|
|
527
|
+
_ref5$textOffset = _ref5.textOffset,
|
|
528
|
+
textOffset = _ref5$textOffset === void 0 ? [0, 0] : _ref5$textOffset,
|
|
529
|
+
_ref5$opacity = _ref5.opacity,
|
|
530
|
+
opacity = _ref5$opacity === void 0 ? 1 : _ref5$opacity,
|
|
531
|
+
_ref5$strokeOpacity = _ref5.strokeOpacity,
|
|
532
|
+
strokeOpacity = _ref5$strokeOpacity === void 0 ? 1 : _ref5$strokeOpacity,
|
|
533
|
+
_ref5$strokeWidth = _ref5.strokeWidth,
|
|
534
|
+
strokeWidth = _ref5$strokeWidth === void 0 ? 0 : _ref5$strokeWidth,
|
|
535
|
+
_ref5$stroke = _ref5.stroke,
|
|
536
|
+
stroke = _ref5$stroke === void 0 ? '#000' : _ref5$stroke;
|
|
537
|
+
|
|
456
538
|
return {
|
|
457
539
|
fontWeight: fontWeight,
|
|
458
540
|
fontFamily: fontFamily,
|
|
@@ -466,39 +548,39 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
466
548
|
stroke: stroke
|
|
467
549
|
};
|
|
468
550
|
}
|
|
469
|
-
|
|
470
551
|
/**
|
|
471
552
|
* 生成文字布局(对照文字纹理字典提取对应文字的位置很好信息)
|
|
472
553
|
*/
|
|
554
|
+
|
|
473
555
|
}, {
|
|
474
556
|
key: "generateGlyphLayout",
|
|
475
557
|
value: function generateGlyphLayout(iconfont) {
|
|
476
558
|
var _this2 = this;
|
|
559
|
+
|
|
477
560
|
var mapping = this.getFontServiceMapping();
|
|
561
|
+
|
|
478
562
|
var _ref6 = this.layer.getLayerConfig(),
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
563
|
+
_ref6$spacing = _ref6.spacing,
|
|
564
|
+
spacing = _ref6$spacing === void 0 ? 2 : _ref6$spacing,
|
|
565
|
+
_ref6$textAnchor = _ref6.textAnchor,
|
|
566
|
+
textAnchor = _ref6$textAnchor === void 0 ? 'center' : _ref6$textAnchor,
|
|
567
|
+
textOffset = _ref6.textOffset;
|
|
568
|
+
|
|
569
|
+
var data = this.rawEncodeData;
|
|
485
570
|
this.glyphInfo = data.map(function (feature) {
|
|
486
571
|
var _feature$shape = feature.shape,
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
var shaping = shapeText(shape.toString(), mapping,
|
|
492
|
-
// @ts-ignore
|
|
572
|
+
shape = _feature$shape === void 0 ? '' : _feature$shape,
|
|
573
|
+
id = feature.id,
|
|
574
|
+
_feature$size2 = feature.size,
|
|
575
|
+
size = _feature$size2 === void 0 ? 1 : _feature$size2;
|
|
576
|
+
var shaping = shapeText(shape.toString(), mapping, // @ts-ignore
|
|
493
577
|
size, textAnchor, 'left', spacing, textOffset || feature.textOffset || [0, 0], iconfont);
|
|
494
578
|
var glyphQuads = getGlyphQuads(shaping, textOffset, false);
|
|
495
579
|
feature.shaping = shaping;
|
|
496
|
-
feature.glyphQuads = glyphQuads;
|
|
497
|
-
// feature.centroid = calculteCentroid(coordinates);
|
|
580
|
+
feature.glyphQuads = glyphQuads; // feature.centroid = calculteCentroid(coordinates);
|
|
498
581
|
|
|
499
|
-
feature.centroid = calculateCentroid(feature.coordinates);
|
|
582
|
+
feature.centroid = calculateCentroid(feature.coordinates); // 此时地图高德2.0 originCentroid == centroid
|
|
500
583
|
|
|
501
|
-
// 此时地图高德2.0 originCentroid == centroid
|
|
502
584
|
feature.originCentroid = feature.version === 'GAODE2.x' ? calculateCentroid(feature.originCoordinates) : feature.originCentroid = feature.centroid;
|
|
503
585
|
_this2.glyphInfoMap[id] = {
|
|
504
586
|
shaping: shaping,
|
|
@@ -512,66 +594,76 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
512
594
|
key: "getFontServiceMapping",
|
|
513
595
|
value: function getFontServiceMapping() {
|
|
514
596
|
var _ref7 = this.layer.getLayerConfig(),
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
597
|
+
_ref7$fontWeight = _ref7.fontWeight,
|
|
598
|
+
fontWeight = _ref7$fontWeight === void 0 ? '400' : _ref7$fontWeight,
|
|
599
|
+
_ref7$fontFamily = _ref7.fontFamily,
|
|
600
|
+
fontFamily = _ref7$fontFamily === void 0 ? 'sans-serif' : _ref7$fontFamily;
|
|
601
|
+
|
|
519
602
|
return this.fontService.getMappingByKey("".concat(fontFamily, "_").concat(fontWeight));
|
|
520
603
|
}
|
|
521
604
|
}, {
|
|
522
605
|
key: "getFontServiceCanvas",
|
|
523
606
|
value: function getFontServiceCanvas() {
|
|
524
607
|
var _ref8 = this.layer.getLayerConfig(),
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
608
|
+
_ref8$fontWeight = _ref8.fontWeight,
|
|
609
|
+
fontWeight = _ref8$fontWeight === void 0 ? '400' : _ref8$fontWeight,
|
|
610
|
+
_ref8$fontFamily = _ref8.fontFamily,
|
|
611
|
+
fontFamily = _ref8$fontFamily === void 0 ? 'sans-serif' : _ref8$fontFamily; // 更新文字布局
|
|
612
|
+
|
|
613
|
+
|
|
530
614
|
return this.fontService.getCanvasByKey("".concat(fontFamily, "_").concat(fontWeight));
|
|
531
615
|
}
|
|
532
|
-
|
|
533
616
|
/**
|
|
534
617
|
* 文字避让 depend on originCentorid
|
|
535
618
|
*/
|
|
619
|
+
|
|
536
620
|
}, {
|
|
537
621
|
key: "filterGlyphs",
|
|
538
622
|
value: function filterGlyphs() {
|
|
539
623
|
var _this3 = this;
|
|
624
|
+
|
|
540
625
|
var _ref9 = this.layer.getLayerConfig(),
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
626
|
+
_ref9$padding = _ref9.padding,
|
|
627
|
+
padding = _ref9$padding === void 0 ? [0, 0] : _ref9$padding,
|
|
628
|
+
_ref9$textAllowOverla = _ref9.textAllowOverlap,
|
|
629
|
+
textAllowOverlap = _ref9$textAllowOverla === void 0 ? false : _ref9$textAllowOverla;
|
|
630
|
+
|
|
545
631
|
if (textAllowOverlap) {
|
|
546
632
|
// 如果允许文本覆盖
|
|
547
633
|
return;
|
|
548
634
|
}
|
|
635
|
+
|
|
549
636
|
this.glyphInfoMap = {};
|
|
550
637
|
this.currentZoom = this.mapService.getZoom();
|
|
551
638
|
this.extent = this.textExtent();
|
|
639
|
+
|
|
552
640
|
var _this$rendererService = this.rendererService.getViewportSize(),
|
|
553
|
-
|
|
554
|
-
|
|
641
|
+
width = _this$rendererService.width,
|
|
642
|
+
height = _this$rendererService.height;
|
|
643
|
+
|
|
555
644
|
var collisionIndex = new CollisionIndex(width, height);
|
|
556
645
|
var filterData = this.glyphInfo.filter(function (feature) {
|
|
557
646
|
var shaping = feature.shaping,
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
// const centroid = feature.centroid as [number, number];
|
|
647
|
+
_feature$id = feature.id,
|
|
648
|
+
id = _feature$id === void 0 ? 0 : _feature$id; // const centroid = feature.centroid as [number, number];
|
|
561
649
|
// const centroid = feature.originCentroid as [number, number];
|
|
650
|
+
|
|
562
651
|
var centroid = feature.version === 'GAODE2.x' ? feature.originCentroid : feature.centroid;
|
|
563
652
|
var size = feature.size;
|
|
564
653
|
var fontScale = size / 16;
|
|
654
|
+
|
|
565
655
|
var pixels = _this3.mapService.lngLatToContainer(centroid);
|
|
656
|
+
|
|
566
657
|
var _collisionIndex$place = collisionIndex.placeCollisionBox({
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
658
|
+
x1: shaping.left * fontScale - padding[0],
|
|
659
|
+
x2: shaping.right * fontScale + padding[0],
|
|
660
|
+
y1: shaping.top * fontScale - padding[1],
|
|
661
|
+
y2: shaping.bottom * fontScale + padding[1],
|
|
662
|
+
anchorPointX: pixels.x,
|
|
663
|
+
anchorPointY: pixels.y
|
|
664
|
+
}),
|
|
665
|
+
box = _collisionIndex$place.box;
|
|
666
|
+
|
|
575
667
|
if (box && box.length) {
|
|
576
668
|
collisionIndex.insertCollisionBox(box, id);
|
|
577
669
|
return true;
|
|
@@ -582,35 +674,39 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
582
674
|
filterData.forEach(function (item) {
|
|
583
675
|
// @ts-ignore
|
|
584
676
|
_this3.glyphInfoMap[item.id] = item;
|
|
585
|
-
});
|
|
586
|
-
// this.layer.setEncodedData(filterData);
|
|
677
|
+
}); // this.layer.setEncodedData(filterData);
|
|
587
678
|
}
|
|
588
679
|
/**
|
|
589
680
|
* 初始化文字布局
|
|
590
681
|
*/
|
|
682
|
+
|
|
591
683
|
}, {
|
|
592
684
|
key: "initGlyph",
|
|
593
685
|
value: function initGlyph() {
|
|
594
686
|
var _this$layer$getLayerC = this.layer.getLayerConfig(),
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
// 2.生成文字布局
|
|
687
|
+
_this$layer$getLayerC2 = _this$layer$getLayerC.iconfont,
|
|
688
|
+
iconfont = _this$layer$getLayerC2 === void 0 ? false : _this$layer$getLayerC2; // 1.生成文字纹理(或是生成 iconfont)
|
|
689
|
+
|
|
690
|
+
|
|
691
|
+
iconfont ? this.initIconFontTex() : this.initTextFont(); // 2.生成文字布局
|
|
692
|
+
|
|
600
693
|
this.generateGlyphLayout(iconfont);
|
|
601
694
|
}
|
|
602
695
|
/**
|
|
603
696
|
* 更新文字纹理
|
|
604
697
|
*/
|
|
698
|
+
|
|
605
699
|
}, {
|
|
606
700
|
key: "updateTexture",
|
|
607
701
|
value: function updateTexture() {
|
|
608
702
|
var createTexture2D = this.rendererService.createTexture2D;
|
|
609
703
|
var canvas = this.getFontServiceCanvas();
|
|
610
704
|
this.textureHeight = canvas.height;
|
|
705
|
+
|
|
611
706
|
if (this.texture) {
|
|
612
707
|
this.texture.destroy();
|
|
613
708
|
}
|
|
709
|
+
|
|
614
710
|
this.texture = createTexture2D({
|
|
615
711
|
data: canvas,
|
|
616
712
|
mag: gl.LINEAR,
|
|
@@ -625,35 +721,43 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
|
|
|
625
721
|
var _reBuildModel = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
|
|
626
722
|
var model;
|
|
627
723
|
return _regeneratorRuntime.wrap(function _callee5$(_context5) {
|
|
628
|
-
while (1)
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
724
|
+
while (1) {
|
|
725
|
+
switch (_context5.prev = _context5.next) {
|
|
726
|
+
case 0:
|
|
727
|
+
this.filterGlyphs();
|
|
728
|
+
_context5.next = 3;
|
|
729
|
+
return this.layer.buildLayerModel({
|
|
730
|
+
moduleName: 'pointText',
|
|
731
|
+
vertexShader: textVert,
|
|
732
|
+
fragmentShader: textFrag,
|
|
733
|
+
triangulation: TextTrianglation.bind(this),
|
|
734
|
+
depth: {
|
|
735
|
+
enable: false
|
|
736
|
+
}
|
|
737
|
+
});
|
|
738
|
+
|
|
739
|
+
case 3:
|
|
740
|
+
model = _context5.sent;
|
|
741
|
+
// TODO 渲染流程待修改
|
|
742
|
+
this.layer.models = [model];
|
|
743
|
+
|
|
744
|
+
case 5:
|
|
745
|
+
case "end":
|
|
746
|
+
return _context5.stop();
|
|
747
|
+
}
|
|
648
748
|
}
|
|
649
749
|
}, _callee5, this);
|
|
650
750
|
}));
|
|
751
|
+
|
|
651
752
|
function reBuildModel() {
|
|
652
753
|
return _reBuildModel.apply(this, arguments);
|
|
653
754
|
}
|
|
755
|
+
|
|
654
756
|
return reBuildModel;
|
|
655
757
|
}()
|
|
656
758
|
}]);
|
|
759
|
+
|
|
657
760
|
return TextModel;
|
|
658
761
|
}(BaseModel);
|
|
762
|
+
|
|
659
763
|
export { TextModel as default };
|