{"action":"created","issue":{"url":"https://api.github.com/repos/kangax/fabric.js/issues/2874","repository_url":"https://api.github.com/repos/kangax/fabric.js","labels_url":"https://api.github.com/repos/kangax/fabric.js/issues/2874/labels{/name}","comments_url":"https://api.github.com/repos/kangax/fabric.js/issues/2874/comments","events_url":"https://api.github.com/repos/kangax/fabric.js/issues/2874/events","html_url":"https://github.com/kangax/fabric.js/issues/2874","id":146743234,"number":2874,"title":"Resize Filter broken on serialized canvas","user":{"login":"csvehla","id":8740195,"avatar_url":"https://avatars.githubusercontent.com/u/8740195?v=3","gravatar_id":"","url":"https://api.github.com/users/csvehla","html_url":"https://github.com/csvehla","followers_url":"https://api.github.com/users/csvehla/followers","following_url":"https://api.github.com/users/csvehla/following{/other_user}","gists_url":"https://api.github.com/users/csvehla/gists{/gist_id}","starred_url":"https://api.github.com/users/csvehla/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/csvehla/subscriptions","organizations_url":"https://api.github.com/users/csvehla/orgs","repos_url":"https://api.github.com/users/csvehla/repos","events_url":"https://api.github.com/users/csvehla/events{/privacy}","received_events_url":"https://api.github.com/users/csvehla/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/kangax/fabric.js/labels/bug","name":"bug","color":"e10c02"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":5,"created_at":"2016-04-07T21:10:11Z","updated_at":"2016-04-08T05:39:25Z","closed_at":null,"body":"Hello, when the canvas is serialized by calling JSON.stringify(canvas), the filters object did not serialize all of its parameters. For example, a resize filter has parameters: type, scaleX, scaleY, rcpScaleX, rcpScaleY, but after converting to JSON or toObject, rcpScaleX and rcpScaleY are missing. Also when I reload from JSON it tries to apply the resize filter again which makes my image even smaller.\r\n\r\nI noticed that these were common issues in #1741 , but I thought they were supposed to be resolved. I have tested on master and also v1.6.0-rc.1 and I am still seeing these problems.\r\n\r\n\r\nJSON before resize filter\r\n`\"{\"objects\":[{\"type\":\"image\",\"originX\":\"left\",\"originY\":\"top\",\"left\":0,\"top\":0,\"width\":1670,\"height\":2327,\"fill\":\"rgb(0,0,0)\",\"stroke\":\"#000000\",\"strokeWidth\":0,\"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\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"filters\":[],\"src\":\"http://local.wordpress.dev/wp-content/uploads/digiwidgets-temp/down35.jpg\",\"crossOrigin\":\"\",\"alignX\":\"none\",\"alignY\":\"none\",\"meetOrSlice\":\"meet\"}],\"background\":\"rgba(0, 0, 0, 0)\",\"canvasWidth\":\"200\",\"canvasHeight\":\"300\",\"templateTitle\":\"Small Vertical\",\"borderStrokeStyle\":\"black\"}\"`\r\n\r\nJSON after resize filter\r\n`\"{\"objects\":[{\"type\":\"image\",\"originX\":\"left\",\"originY\":\"top\",\"left\":0,\"top\":0,\"width\":215.2986678126343,\"height\":300,\"fill\":\"rgb(0,0,0)\",\"stroke\":\"#000000\",\"strokeWidth\":0,\"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\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"filters\":[{\"type\":\"Resize\",\"scaleX\":0.1289213579716373,\"scaleY\":0.1289213579716373,\"resizeType\":\"sliceHack\",\"lanczosLobes\":3}],\"src\":\"http://local.wordpress.dev/wp-content/uploads/digiwidgets-temp/down34.jpg\",\"crossOrigin\":\"\",\"alignX\":\"none\",\"alignY\":\"none\",\"meetOrSlice\":\"meet\"}],\"background\":\"rgba(0, 0, 0, 0)\",\"canvasWidth\":\"200\",\"canvasHeight\":\"300\",\"templateTitle\":\"Small Vertical\",\"borderStrokeStyle\":\"black\"}\"`"},"comment":{"url":"https://api.github.com/repos/kangax/fabric.js/issues/comments/207224024","html_url":"https://github.com/kangax/fabric.js/issues/2874#issuecomment-207224024","issue_url":"https://api.github.com/repos/kangax/fabric.js/issues/2874","id":207224024,"user":{"login":"asturur","id":1194048,"avatar_url":"https://avatars.githubusercontent.com/u/1194048?v=3","gravatar_id":"","url":"https://api.github.com/users/asturur","html_url":"https://github.com/asturur","followers_url":"https://api.github.com/users/asturur/followers","following_url":"https://api.github.com/users/asturur/following{/other_user}","gists_url":"https://api.github.com/users/asturur/gists{/gist_id}","starred_url":"https://api.github.com/users/asturur/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/asturur/subscriptions","organizations_url":"https://api.github.com/users/asturur/orgs","repos_url":"https://api.github.com/users/asturur/repos","events_url":"https://api.github.com/users/asturur/events{/privacy}","received_events_url":"https://api.github.com/users/asturur/received_events","type":"User","site_admin":false},"created_at":"2016-04-08T05:39:25Z","updated_at":"2016-04-08T05:39:25Z","body":"The problem here is just width and height values. The image element has the same number of bytes.\r\nI think that we should keep some original width and original height in the image as we keep original element after filtering.\r\n\r\nDo you know that those resize filters can be also applied during scaling, instead that once at initialization? you can put the filter for resize in the resizeFilters array instead of filters. In this way the image is resized dinamically and not once at load."}}