Как динамически установить Javascript style.tranform="scale"
Я объявил переменную var scale=0.8 в скрипте в теле моего html, и когда я изменяю размер графика, сделанного русалкой, я соответствующим образом обновляю масштаб, например
<script>
var scale=0.8;
DeployGraph();
function toggleZoomScreen(mode){
if (mode == 1){
scale+=0.1;
// document.body.style.zoom=scale.toString()+"%";
}
else if (mode == 2){
scale-=0.1;
// document.body.style.zoom=scale.toString()+"%";
}
var mer = document.getElementById("mermaid");
mer.style.transform= "scale("+scale+","+scale+")";
}
</script>
Я хочу каким-то образом сохранить значение переменной, чтобы каждый раз, когда я обновляюсь, вызывался DeployGraph, и размер графика изменялся в том же значении масштаба. DeployGraph объявляется в заголовке html, а не в теле. Можно ли это сделать?
Я попытался создать другую переменную в голове и обновлять ее каждый раз, когда изменяется значение масштаба, а затем в DeployGraph я использую
element.style.transform= "scale("+scale+","+scale+")"; где element = document.getElementById("русалка");
Однако значение всегда является значением по умолчанию.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы не можете сохранять переменные при обновлении страницы.
Что вам нужно сделать, так это сохранить нужное вам значение в браузере и проверить его после загрузки страницы.
Вы можете сделать это, используя Параметры поиска URL, печенье или локальное хранилище.
При использовании локального хранилища вы можете сделать следующее:
// On document load, after initialising the scale variable
scale = window.localStorage.getItem('scale') || 0.8; // add || 0.8 in case value is undefined
// In toggleZoomScreen
function toggleZoomScreen(mode){
if (mode == 1){
scale+=0.1;
}
else if (mode == 2){
scale-=0.1;
}
// Update the value in local storage
window.localStorage.setItem('scale', scale);
var mer = document.getElementById("mermaid");
mer.style.transform= "scale("+scale+","+scale+")";
}
Если он не работает в браузере, ни один из подходов не будет работать, но нужная вам концепция останется прежней. Вы можете проверить, предоставляет ли программа erm какой-либо API, похожий на локальное хранилище или файлы cookie.
Когда я пробую решение для локального хранилища, я получаю сообщение «Невозможно получить свойство getItem неопределенной или нулевой ссылки». HTML-код не запускается непосредственно в браузере, он используется для отображения графика, созданного русалкой внутри элемента управления программы ERP. Есть мысли по этому поводу?