Перерисовать холст, используя объект localStorage в FabricJs

Идентификатор моего холста — «canvas-panel». Я хочу перерисовать свой холст, используя значение объекта localStorage при переходе на следующую страницу. Я получаю объект холста, используя объект localStorage, как показано ниже:

var myCanvas = JSON.parse(localStorage.getItem('canvas'));

Формат JSON:

{
"objects":[

  {
     "type":"image",
     "originX":"left",
     "originY":"top",
     "left":42,
     "top":311,
     "width":100,
     "height":100,
     "fill":"rgb(0,0,0)",
     "stroke":null,
     "strokeWidth":1,
     "strokeDashArray":null,
     "strokeLineCap":"butt",
     "strokeLineJoin":"miter",
     "strokeMiterLimit":10,
     "scaleX":1,
     "scaleY":1,
     "angle":0,
     "flipX":false,
     "flipY":false,
     "opacity":1,
     "shadow":null,
     "visible":true,
     "clipTo":null,
     "backgroundColor":"",
     "fillRule":"nonzero",
     "globalCompositeOperation":"source-over",
     "src":"http://stg.souqueen.com/media/catalog/product/cache/1/image/300x300/9df78eab33525d08d6e5fb8d27136e95/1/9/19b_1024i1.PNG",
     "filters":[

     ],
     "crossOrigin":"",
     "alignX":"none",
     "alignY":"none",
     "meetOrSlice":"meet"
  }
],
"background":""
}

Я получаю весь объект холста с помощью этого потока Выбрать все объекты на холсте с помощью Fabric.js


person Hussain    schedule 11.10.2015    source источник


Ответы (1)


У вас есть JSON. Итак, теперь на следующей странице вы можете импортировать объекты, используя это:

canvas.loadFromJSON(myCanvas, canvas.renderAll.bind(canvas))

person Harsh Makani    schedule 11.10.2015
comment
Он загружается в новый холст, но не изменяет существующий холст, я делаю что-то не так? - person Hussain; 12.10.2015
comment
проверьте canvas, который вы используете. Это может быть проблемой. - person Harsh Makani; 12.10.2015