implement text path

[fuzhenn]

Issue description
To draw texts along the path

reference:
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/textPath

[deyihu]

这个功能已经实现

• 开启

  var map = new maptalks.Map('map', {
            "center": [120.66798102314476, 30.98710361260956], "zoom": 11, "pitch": 0.20000000000003, "bearing": -3,
            maxFPS: 30,
            // // devicePixelRatio: 2,
            baseLayer: new maptalks.TileLayer('base', {
                urlTemplate: "https://webst01.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}",
                urlTemplate: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
                subdomains: ['a', 'b', 'c', 'd'],
                attribution: '&copy; <a href="http://osm.org">OpenStreetMap</a> contributors, &copy; <a href="https://carto.com/">CARTO</a>'
            })
        });

        const layerOptions = {
            'forceRenderOnMoving': false,
            'forceRenderOnZooming': false,
            'forceRenderOnRotating': false,
            collision: true,
            collisionDelay: 0,
        }

        const layer = new maptalks.VectorLayer('layer', {
            ...layerOptions
        }).addTo(map);
        const layer1 = new maptalks.VectorLayer('layer1', {
            ...layerOptions
        }).addTo(map);

        const coordinates = [
            [
                120.61146665920035,
                31.205774184079388
            ],
            [
                120.61131866872256,
                31.203103349749625
            ],
            [
                120.6111114820535,
                31.200021037255937
            ],
            [
                120.61102268776676,
                31.19862858389658
            ],
            [
                120.61082290062154,
                31.194799231488645
            ],
            [
                120.61054847611308,
                31.19078457808652
            ],
            [
                120.61039135969475,
                31.187245183978035
            ],
            [
                120.61043063879936,
                31.18608029114617
            ],
            [
                120.61053538307829,
                31.18519541104891
            ],
            [
                120.6109281741243,
                31.184209712087664
            ],
            [
                120.61117694178677,
                31.1837728649476
            ],
            [
                120.61185777959986,
                31.182663936230796
            ],
            [
                120.6123684079597,
                31.181812628604433
            ],
            [
                120.61300996666819,
                31.180390031671237
            ],
            [
                120.61323254826095,
                31.179572308798896
            ],
            [
                120.61353368806294,
                31.177981649556983
            ],
            [
                120.61349440895833,
                31.176446974116487
            ],
            [
                120.61323254826095,
                31.17482265549856
            ],
            [
                120.61155663979798,
                31.171271461898954
            ],
            [
                120.61043063879936,
                31.169154125382676
            ],
            [
                120.6091213353127,
                31.166353342995848
            ],
            [
                120.60851905570871,
                31.164863293020375
            ],
            [
                120.60696098455946,
                31.161311726025275
            ],
            [
                120.60582189052604,
                31.158701183377588
            ],
            [
                120.6045780522137,
                31.155687205639282
            ],
            [
                120.60368772584275,
                31.153849640578613
            ],
            [
                120.6032032835526,
                31.152594697624608
            ],
            [
                120.60198563130996,
                31.149815836239696
            ],
            [
                120.60157974722915,
                31.148818563701724
            ],
            [
                120.60089890941595,
                31.14713774354763
            ],
            [
                120.60047993230023,
                31.145871506017187
            ],
            [
                120.6000520483384,
                31.143764204345615
            ],
            [
                120.5999010405103,
                31.1426139309672
            ],
            [
                120.59984063737909,
                31.140597687784663
            ],
            [
                120.60030876164615,
                31.137017458028907
            ],
            [
                120.60224166184594,
                31.13036071495631
            ],
            [
                120.60444637613625,
                31.12233322488052
            ],
            [
                120.60654752399739,
                31.114885053747543
            ],
            [
                120.60794972624899,
                31.11036009205648
            ],
            [
                120.60831645606856,
                31.108679337068367
            ],
            [
                120.60920092210415,
                31.104745145883072
            ],
            [
                120.60930878381578,
                31.101771306352447
            ],
            [
                120.60902834336548,
                31.098741957923465
            ],
            [
                120.60868318588814,
                31.097042525038347
            ],
            [
                120.60715154958268,
                31.09299701356045
            ],
            [
                120.60564148561957,
                31.090466172212103
            ],
            [
                120.60512374940356,
                31.08959791183915
            ],
            [
                120.60495117066489,
                31.08928385826104
            ],
            [
                120.60868318588814,
                31.088341691298837
            ],
            [
                120.61414098849787,
                31.08736256671412
            ],
            [
                120.62201489344875,
                31.087177825095097
            ],
            [
                120.62818458335528,
                31.086937660453458
            ],
            [
                120.64207717181648,
                31.08630953467494
            ],
            [
                120.64775069784946,
                31.086124791008757
            ],
            [
                120.65333793451327,
                31.085810725952086
            ],
            [
                120.65735039018682,
                31.08542276180205
            ],
            [
                120.66233360126523,
                31.084850049923915
            ],
            [
                120.6659793271192,
                31.084111061755692
            ],
            [
                120.6700133551351,
                31.083353592919906
            ],
            [
                120.6707683871166,
                31.083298168133894
            ],
            [
                120.68064851990425,
                31.081450656772944
            ],
            [
                120.68718493963047,
                31.080379083728957
            ],
            [
                120.69199557197021,
                31.079824817069465
            ],
            [
                120.69669834259844,
                31.079621585151216
            ],
            [
                120.70549985826938,
                31.079898719477427
            ],
            [
                120.71192841628408,
                31.08056383856396
            ],
            [
                120.71594087195763,
                31.080785543891892
            ],
            [
                120.72150653627898,
                31.080840970143043
            ],
            [
                120.72933729654505,
                31.08058231402768
            ],
            [
                120.73669346527993,
                31.080268230655605
            ],
            [
                120.74219441257435,
                31.08012042635673
            ],
            [
                120.75043504734481,
                31.07993567065992
            ],
            [
                120.75440435833366,
                31.08006499968539
            ],
            [
                120.76040146950163,
                31.08015737745299
            ]
        ];

        const symbol = {
            lineWidth: 8,
            lineColor: 'black',
            textName: '苏州湾大道',
            // textName: 'Hello World',
            // textPlacement?: 'point' | 'vertex' | 'line' | 'vertex-first' | 'vertex-last';
            textPlacement: 'line',
            textSpacing: 500,
            textFill: 'yellow',
            textFaceName: '微软雅黑',
            textWeight: 'bold',
            textSize: 12,
            textOpacity: 1,
            // textDy: 10,
            textHaloFill: '#000',
            textHaloRadius: 1,
            textHaloOpacity: 1,
            // textAlongDebug: true
        }
        const line = new maptalks.LineString(coordinates, {
            // enableClip: true,
            symbol: Object.assign({}, symbol)
        }).addTo(layer)

        map.setView({
          "center":[120.63297278,31.12046989],"zoom":12.619233141066326,"pitch":0,"bearing":4.499999999999204
        })

• 注意点：因为canvas处理文字性能太差了，故把字符做成纹理了，以此来提高性能，字符的缓存用LRU管理，故当页面有大量的字符时，会值性能急剧下降，目前LRU的最大值设置为50000