如何在MapKit JS中更新LookAround对象的坐标？

我需要更新LookAround实例的坐标，但MapKit JS中没有类似Swift里的MKLookAroundSceneRequest类——在Swift中可以用这个类指定新坐标获取LookAroundScene，再关联到现有LookAround对象，但JS里没有这个类。

目前我每次更新坐标都会销毁旧的LookAround对象再创建新的，代码如下：

var lookAround
var is_lookAround_load_complete = false
var is_first_time_lookAround = true // only for 1st time load 

function create_apple_look_around(lookAround_lat, lookAround_lng){
    /*
        no way to update coordinate of existing look around object, 
        have to destroy it before create a new one 

        You have to wait existing look around object load completed, or ready-state change to complete.
        Then destroy it.
        Otherwise, if no wait, when ready-state is still loading, to destroy a loading one will crash.

        warning:  not fix issue, 
        if trigger too much look-around in short time,
        console will get this message:
                         WARNING: Too many active WebGL contexts. Oldest context will be lost
        at this point, your apple base map is the oldest webGL contexts, lost means apple base map crash. 
    */
    
    if ((is_first_time_lookAround) || (is_lookAround_load_complete)){  
        is_first_time_lookAround = false
       
        if (lookAround){
            console.log("- - - Look Around - - - before destroy, lookAround.readyState ", lookAround.readyState)
            lookAround.destroy()
            is_lookAround_load_complete = false
            console.log("- - - Look Around - - - after destroy,  lookAround.readyState ", lookAround.readyState)
        }
        
        // Create an interactive Look Around view.
        lookAround = new mapkit.LookAround(
            document.getElementById("apple-look-around-container"),
            new mapkit.Coordinate(lookAround_lat, lookAround_lng),
            {
                showsDialogControl:  true,
                showsCloseControl: false,
                isNavigationEnabled:  true,
                isScrollEnabled:  true,
                showsRoadLabels: true,
                showsPointsOfInterest: true,
            }
        );

        // 1. Catch the Load Event
        lookAround.addEventListener('load', (e) => {
            console.log("- - - Look Around - - - view loaded successfully, readystate: ", lookAround.readyState, "  event: ", e);
            is_lookAround_load_complete = true
        });

        // 2. Catch the Error Event
        lookAround.addEventListener('error', (e) => {
            console.log("- - - Look Around - - -  error, readystate: ", lookAround.readyState, "  event: ", e);
            is_lookAround_load_complete = true
        });

        lookAround.addEventListener('readystatechange', (e) => {
            console.log("- - - Look Around - - -  readystatechange, readystate: ", lookAround.readyState, "  event: ", e);
            is_lookAround_load_complete = true
        });

        lookAround.addEventListener('open-dialog', (e) => {
            console.log("- - - Look Around - - -  open-dialog, readystate: ", lookAround.readyState, "  event: ", e);
        });

        lookAround.addEventListener('leave-dialog', (e) => {
            console.log("- - - Look Around - - -  leave-dialog, readystate: ", lookAround.readyState, "  event: ", e);
        });

        // 3. Catch the Close Event
        lookAround.addEventListener('close', (e) => {
            console.log("- - - Look Around - - -  User closed the Look Around view, readystate: ", lookAround.readyState, "  event: ", e);
            is_lookAround_load_complete = true
        });
    }
}

但这种方法有个严重问题：用户切换坐标20次以上后，浏览器WebGL上下文达到上限，最早的WebGL上下文（也就是Apple基础地图）会丢失，导致地图空白，必须刷新页面才能恢复。

解决方案：复用LookAround实例，调用setScene更新坐标 #

MapKit JS的LookAround实例本身提供了setScene()方法，不需要销毁重建实例，直接传入新坐标即可更新场景，完全避免WebGL上下文泄漏问题。

修改后的代码示例：

var lookAround;
var isLookAroundReady = false;

// 只初始化一次LookAround实例
function initAppleLookAround() {
    lookAround = new mapkit.LookAround(
        document.getElementById("apple-look-around-container"),
        // 设置一个默认初始坐标
        new mapkit.Coordinate(37.7749, -122.4194),
        {
            showsDialogControl: true,
            showsCloseControl: false,
            isNavigationEnabled: true,
            isScrollEnabled: true,
            showsRoadLabels: true,
            showsPointsOfInterest: true,
        }
    );

    // 监听初始化完成事件
    lookAround.addEventListener('load', () => {
        isLookAroundReady = true;
        console.log("LookAround 初始化完成");
    });

    // 监听场景切换完成事件，确认坐标更新成功
    lookAround.addEventListener('scene-change', (event) => {
        console.log("场景已更新到新坐标:", event.scene.coordinate);
    });

    // 监听错误事件，避免状态卡住
    lookAround.addEventListener('error', (error) => {
        console.error("LookAround 加载错误:", error);
        isLookAroundReady = true;
    });
}

// 专门的坐标更新方法
function updateLookAroundCoordinate(lat, lng) {
    if (!lookAround || !isLookAroundReady) return;
    
    // 直接调用setScene更新坐标，无需销毁实例
    lookAround.setScene(new mapkit.Coordinate(lat, lng));
}

// 页面加载完成后初始化LookAround
document.addEventListener('DOMContentLoaded', initAppleLookAround);

方案优势 #

• 复用同一个LookAround实例，彻底避免频繁创建/销毁导致的WebGL上下文累积问题
• setScene()是MapKit JS官方提供的场景更新接口，内部会复用已有资源，性能更优
• 通过scene-change事件可以精准判断场景更新状态，避免重复触发更新

内容的提问来源于stack exchange，提问作者hoogw