Hi All,
I have implemented the code to set cookies in the selection of imagery and scene mode. When I restarted the browser or close the browser and open, the selection imagery and scene mode will be shown… My codes works.But I would like your comment based on my code. My code is found below…
var viewer = new Cesium.Viewer(‘cesiumContainer’);
//The cookies is set in the selection of the Scene Mode
var classname = document.getElementsByClassName(“cesium-sceneModePicker-dropDown-icon”);
var myFunction = function() {
var attribute = this.getAttribute(“title”);
if(attribute==‘2D’){
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “SceneMode=2D;” + expires;
console.log(document.cookie);
} else if(attribute==‘3D’){
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “SceneMode=3D;” + expires;
console.log(document.cookie);
} else {
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “SceneMode=Columbus View;” + expires;
console.log(document.cookie);
}
};
for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener(‘click’, myFunction, false);
}
//The cookies is set upon the selection of Imagery
var classnameImaginary = document.getElementsByClassName(“cesium-baseLayerPicker-item”);
var imaginaryChange = function() {
var imaginaryName= this.querySelector(’.cesium-baseLayerPicker-itemLabel’).innerHTML
if (imaginaryName == “Bing Maps Aerial”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” +0 + “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Bing Maps Aerial with Labels”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” +1+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Bing Maps Roads”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 2+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Mapbox Satellite”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 3+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Mapbox Streets”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 4+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Mapbox Streets Classic”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 5+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “ESRI World Imagery”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 6+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “ESRI World Street Map”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 7+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “ESRI National Geographic”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 8+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “OpenStreetMap”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 9+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Stamen Watercolor”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 10+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Stamen Toner”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 11+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “The Black Marble”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 12+ “;” + expires;
console.log(document.cookie);
}
else if (imaginaryName == “Natural Earth II”)
{
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 13+ “;” + expires;
console.log(document.cookie);
}
};
for (var i = 0; i < classnameImaginary.length; i++) {
classnameImaginary[i].addEventListener(‘click’, imaginaryChange, false);
}
//Make a array and store the cookies in the array.
function get_cookies_array() {
var cookies = { };
//Check if the cookies is empty or not
if (document.cookie && document.cookie != ‘’) {
var split = document.cookie.split(’;’);
for (var i = 0; i < split.length; i++) {
var name_value = split[i].split("=");
name_value[0] = name_value[0].replace(/^ /, ‘’);
cookies[decodeURIComponent(name_value[0])] = decodeURIComponent(name_value[1]);
}
//If there is cookie, return the cookie
return cookies;
}
//If there is no cookie,select the default Imagery and Scene Mode
else
{
var baseLayerPickerViewModel = viewer.baseLayerPicker.viewModel;
baseLayerPickerViewModel.selectedImagery=baseLayerPickerViewModel.imageryProviderViewModels[11];
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “Imagery Number=” + 11+ “;” + expires;
console.log(document.cookie);
var scene = viewer.scene;
scene.mode= Cesium.SceneMode.SCENE2D;
var d = new Date();
d.setTime(d.getTime() + (32460601000));
var expires= “expires=”+d;
document.cookie = “SceneMode=2D;” + expires;
console.log(document.cookie);
}
}
var cookies = get_cookies_array();
for(var name in cookies) {
if (name==“SceneMode”)
{
if (cookies[name]== “2D”)
{
var scene = viewer.scene;
scene.mode= Cesium.SceneMode.SCENE2D;
console.log(“SceneMode=2D”);
}
else if (cookies[name]==“3D”)
{
var scene = viewer.scene;
scene.mode= Cesium.SceneMode.SCENE3D;
console.log(“SceneMode=3D”);
}
else if (cookies[name]==“Columbus View”)
{
var scene = viewer.scene;
scene.mode= Cesium.SceneMode.COLUMBUS_VIEW;
console.log(“SceneMode=Columbus View”);
}
}
else if (name==“Imagery Number”)
{
var baseLayerPickerViewModel = viewer.baseLayerPicker.viewModel;
baseLayerPickerViewModel.selectedImagery=baseLayerPickerViewModel.imageryProviderViewModels[cookies[name]];
console.log(“Imagery Number=” + cookies[name]);
}
}
can you please give me comment based on my code… Is it the correct method track the changes in the selection of Imagery and Scene Mode???