I want to update coordinate of the lookaround instance object.
But mapkit.js does not have LookAroundSceneRequest class,
how am I going to do.
In swift, there is MKLookAroundSceneRequest class, you can specify a new coordinate with this class, to get a new LookAroundScene object, then attach new LookAroundScene to the existing lookAround object,
But how am I going to do the same with mapkit.js ??
it missing LookAroundSceneRequest class in js
The paradigm between MapKit and MapKit JS is slightly different. The LookAround API documentation has code snippets that you can look at, and there's a sample code webpage that puts the code from the documentation into practice to show you the results on a web page.
— Ed Ford, DTS Engineer
Ed Ford, DTS Engineer
Your reply does not help. I have look at the sample code thousands times before I ask this question here.
The sample code, and document api does not mention how to update coordinate for the look around object.
I need constantly change the look around scene coordinate,
the sample code only create look around object based on one coordinate.
If I need to update coordinate to a different location for this look around object, can you share the sample code to do this job here for everyone that is interested?
This is my code, it destroy everytime before create a new one. It works, but it can crash browser webGL if user change coordinate 16 times and above ,
then it cause apple base map blank.
` // // --- --- apple look around --- //
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.
https://github.com/mapbox/mapbox-gl-js/issues/7332
*/
// 3 all works the same,
//if ((is_first_time_lookAround) || (lookAround.readyState == "complete")){ //possible value: complete destroyed
if ((is_first_time_lookAround) || (is_lookAround_load_complete)){
//if ((is_first_time_lookAround) || ( (is_lookAround_load_complete) && (lookAround.readyState == "complete") )){
is_first_time_lookAround = false
if (lookAround){
console.log("- - - Look Around - - - before destroy, lookAround.readyState ", lookAround.readyState)
// destroy not work, after a few times use, eventually will failed loading,
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(
//lookAround = new mapkit.LookAroundPreview(
// html tag
document.getElementById("apple-look-around-container"),
// location?: Coordinate | Place | LookAroundScene,
new mapkit.Coordinate(lookAround_lat, lookAround_lng),
// options?: LookAroundOptions,
{
// Allow users to expand the view.
showsDialogControl: true,
showsCloseControl: false, //true,
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
});
/*
// should be able to update existing look around
console.log(" new coord ", new mapkit.Coordinate(lookAround_lat, lookAround_lng))
console.log(" lookAround ", lookAround)
console.log(" lookAround.scene ", lookAround.scene)
console.log(" lookAround.scene.copy ", lookAround.scene.copy)
console.log(" lookAround.scene.copy ", lookAround.scene.copy)
//console.log(" lookAround.lookAroundViews ", lookAround.lookAroundViews)// undefined
//lookAround.pointOfInterest = new mapkit.Coordinate(lookAround_lat, lookAround_lng)
*/
}//if
}