javascript - 将 Javascript 对象数组转换为 google.maps.LatLng 对象数组

Question

如何将传递到 JavaScript 函数的对象数组转换为适合构建 google.maps.Polyline 的普通 google.maps.LatLng 对象数组.我正在尝试从传递给 JavasSript 函数的 lat/lnt 对象数组初始化 google map 实例。查看我的 JavaScript 控制台(在 Vhrome 浏览器中)，我可以看到我成功接收到一个包含 66 个对象的数组。

下面的 var updateMap = function (flightPlan) 是我遇到问题的地方。

<script>
    // This example creates a 2-pixel-wide red polyline showing the path of
    // the first trans-Pacific flight between Oakland, CA, and Brisbane,
    // Australia which was made by Charles Kingsford Smith.
    function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 3,
            center: { lat: 0, lng: -180 },
            mapTypeId: 'terrain'
        });

        var flightPlanCoordinates = [
            { lat: 37.772, lng: -122.214 },
            { lat: 21.291, lng: -157.821 },
            { lat: -18.142, lng: 178.431 },
            { lat: -27.467, lng: 153.027 }
        ];
        var flightPath = new google.maps.Polyline({
            path: flightPlanCoordinates,
            geodesic: true,
            strokeColor: '#FF0000',
            strokeOpacity: 1.0,
            strokeWeight: 2
        });
        flightPath.setMap(map);

        // function to initialize google map with a flight plan
        // effectively an array of waypoints containing
        // latitude, longitude and bearing.  The flightPlan below
        // is an array of json objects.
        var updateMap = function (flightPlan) {
            // waypoint data is always a list of nulls
            console.log(flightPlan);
            // how do I create an array similar to
            // var flightPlanCoordinates above suitable
            // for initializing the google map
            var latLngArray;
            // how do I convert to suitable lat/lng array
            //waypointData.forEach(function(next)){
            //    latLngArray.push(new google.maps.LatLng(
            //        next.lat, next.lng));
            //}
            // waypoint data is always a list of nulls
            console.log(latLngArray);
        }

        // script called once web page loaded
        window.onload = function () {
            new QWebChannel(qt.webChannelTransport,
                function (channel) {
                    console.log(channel.objects);
                    // whenever the route data changes, invoke updateMap slot
                    var dataSource = channel.objects.routeIPC;
                    dataSource.routesChanged.connect(updateMap);
                }
            );
        }

    }
</script>

Answer 1

基本用法，示例只是用新属性“ID”修改对象，随意删除:

const normalArray = jsonArray.map(item => {
 const constructedItem = {...item, id: generateRandomID()};

 return constructedItem;
});