I am using canvas and sketch.js file functions which is available on internet easily for to draw site diagram .
http://intridea.github.io/sketch.js/
now problem is every thing is working fine but once a diagram is saved I am unable to bring it back to the same canvas for further editing.
I have tried various solutions but nothing worked which are follows:
<canvas id="tools_sketch" width="800" height="300" style="background: url(http://farm1.static.flickr.com/91/239595759_3c3626b24a_b.jpg) no-repeat center center;"></canvas>
but the backgroung image is not saved if i make modifications and save it. only the newly drawn image is get saved
tried encoding it back to base 64 and write to canvas but unsuccessful here is my commented code which i have tried but failed: and ended up not to try any more
//function loadCanvas(dataURL) {
// var canvas = document.getElementById('colors_sketch');
// var context = canvas.getContext('2d');
// // load image from data url
// var imageObj = new Image();
// imageObj.onload = function () {
// context.drawImage(this, 0, 0);
// };
// imageObj.src = dataURL;
//}
//// make ajax call to get image data url
//var request = new XMLHttpRequest();
//request.open('GET', '', true);
//request.onreadystatechange = function () {
// // Makes sure the document is ready to parse.
// if (request.readyState == 4) {
// // Makes sure it's found the file.
// if (request.status == 200) {
// alert();
// loadCanvas(request.responseText);
// }
// }
//};
//request.send(null);
, nothing happened.
If anyone can help on this he might be a genius.
