canvasで描いた絵をlocalstorageに保存してデータを表示したい
canvasとlocalstorageを使ったwebアプリケーションを作っているのですが、
canvas内に描いたデータをlocalstorageに出力して、そのデータを画像で表示するところまで行いたいと思っています。
色々調べてみるとbase64を使って、描いた絵を文字列として認識するのは分かり、
localstorageには、png型で記載されているのですが、いまいちそのデータを画像表示する書き方が分かりません。
$("#save").on("click", function(){
var canvas = document.getElementById("drawarea");
var base64 = canvas.toDataURL();
localStorage.setItem(save, base64);
});
$(window).on("load", function(){
if(localStorage.getItem("save")){
var base64 = localStorage.getItem("save")
$("#drawarea").val(base64);
}
});
canvasつまり"drawarea"にbase64にセーブしたデータを表示したいのですが、
これだとリロードしても表示されないままです。
どう記述するのが良いのか教えて欲しいです。