MCHMAP 丨 地图引擎 > 快速开始 > MCHMAP > loadMarkers 加载多个标注

loadMarkers 加载多个标注

实例:loadMarkers(data, markerOption, type,needTrans);

参数说明:

data(Array):标注数据数组。具体内容见loadMarker函数中的data参数。

markerOption(Object):标注的配置对象,包含billboard和label两个属性。

        billboard配置项:http://cesium.xin/cesium/cn/Documentation1.62/BillboardGraphics.html

        label配置项:http://cesium.xin/cesium/cn/Documentation1.62/LabelGraphics.html

type(Number):标注类型,默认值为1。type取值及代表含义:1. 只加载marker,2. 同时加载marker和label,3.只加载label

needTrans(Boolean):是否需要GCJ02(高德地图、腾讯地图、谷歌地图等)转换WGS84,默认false

返回值:

Promise对象,loadMarkers(markerinfo, markerOption, 1).then(markers => {}),markers为添加的多个marker对象的数组

代码示例:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="https://mhc.ixiera.com/mhc/main.js"></script>
        <script src="https://mhc.ixiera.com/mhc/Cesium-1.120/Build/Cesium/Cesium.js"></script>
        <script src="https://mhc.ixiera.com/mhc/Cesium3DTile.js"></script>
        <title>loadMarkers</title>
    </head>
    <body>
        <div id="container"></div>
        <script>
            MchCesium.init('container');
            const markerInfos = [
                { id: 'marker1', text: '生命之洞', description: '服务器获取的数据1', lng: 104.461479, lat: 31.83257, },
                { id: 'marker2', text: '税务局', description: '服务器获取的数据2', lng: 104.460787, lat: 31.832211, },
                { id: 'marker3', text: '林业局', description: '测试', lng: 104.461191, lat: 31.830424, }
            ]
            const markerOption = {
                billboard: { image: 'https://mhc.ixiera.com/img/bz.png', width: 30, height: 35, },
                label: { font: '20px', pixelOffset: new Cesium.Cartesian2(0, -38) }
            }
            MchCesium.loadMarkers(markerInfos, markerOption, 2, true).then(markers => {
                MchCesium.viewer.flyTo(MchCesium.viewer.entities);
            })
        </script>
    </body>
</html>

效果展示:

本文档来自—MCHMAP 丨 地图引擎平台