Показать сообщение отдельно
  #5 (permalink)  
Старый 11.03.2019, 18:06
Новичок на форуме
Отправить личное сообщение для Valeriy__258 Посмотреть профиль Найти все сообщения от Valeriy__258
 
Регистрация: 11.03.2019
Сообщений: 5

Сообщение от Dilettante_Pro Посмотреть сообщение
<canvas id = 'c1' width='400' height='200'></canvas>
<button id = 'save' >Save</button>
<img id = 'cImg' src = ''>
<script>
var canvas = document.getElementById('c1');
var ctx = canvas.getContext('2d');
var myColor = 'black';
canvas.onmousedown = function() {
   canvas.onmousemove = function(e) {
       var x = e.offsetX,
             y = e.offsetY;
       ctx.fillStyle = myColor;
       ctx.fillRect(x - 5,y - 5,10,10);
   }
   canvas.onmouseup = function() {
      canvas.onmousemove = null;
   }
}
document.querySelector('#save').onclick = function() {
       var imageURI = canvas.toDataURL("image/jpg");
       localStorage.setItem('img',imageURI);
       document.querySelector('#cImg').src =  localStorage.getItem('img');
}
</script>
Круто!
Но мне нужно немного другое(
Нужно, чтобы изображение сохранялось в рабочем поле, т.е. я открыл себе программку в браузере, нарисовал что-то, потом закрыл её, открыл снова, и могу продолжать рисовать на том же рисунке
Ответить с цитированием