从Json fabric加载js

我想从textarea加载一个对象，下面显示了我的代码（带有导出代码），但我无法弄清楚如何加载fromjson。任何人都可以帮忙请。我在互联网上寻找了一个类似的例子，但除了kitchensink json选项卡上的一个，我找不到一个。从Json fabric加载js

// to JSON string 
$("#canvas2json").click(function(){ 

    canvas.isDrawingMode = false; 

    if(!window.localStorage){alert("This function is not supported by your browser."); return;} 

    var json = JSON.stringify(canvas); 
    //canvas.renderAll(); 
    $("#myTextArea").text(json); 

}); 


// from JSON string 
$("#loadJson2Canvas").click(function(){ 


var jsonLoad = "'" + document.getElementById("myTextArea")+ "'"; 

//alert(jsonLoad).value; 

canvas = window.canvas = new fabric.Canvas('canvas'); 

canvas.loadFromJSON(jsonLoad, canvas.renderAll.bind(canvas)); 


});

来源

2016-10-31 Wayne Gilliver

在你的脚本的问题是下面的语句：

var jsonLoad = "'" + document.getElementById("myTextArea")+ "'";

这不回你textarea的内容，但DOM元素，等等的ToString结果。由于您使用jQuery你可以做类似

$("#myTextArea").val()

等：

$(function() { 
 
    var canvas = new fabric.Canvas('c'); 
 
    /* 
 
    canvas.add(new fabric.Circle({ 
 
    radius: 50, 
 
    left: 0, 
 
    top: 0, 
 
    fill: '#0B61A4' 
 
    })); 
 
    */ 
 

 
    $("#canvas2json").click(function() { 
 
    var json = canvas.toJSON(); 
 
    $("#myTextArea").text(JSON.stringify(json)); 
 
    }); 
 
    $("#loadJson2Canvas").click(function() { 
 
    canvas.loadFromJSON(
 
     $("#myTextArea").val(), 
 
     canvas.renderAll.bind(canvas)); 
 

 
    }); 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.6.4/fabric.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<canvas id='c' width=300 height=150></canvas> 
 
<br/> 
 
<button id='canvas2json'>canvas2json</button> 
 
<button id='loadJson2Canvas'>loadJson2Canvas</button> 
 
<br/> 
 
<textarea id='myTextArea'></textarea>

来源

2016-10-31 19:20:30 InferOn

感谢您的回答，完美....但作为第二个问题..无论如何，将toJSON更改为URL？并让它成为人们可以分享的一个可用的URL。 –

从未使用，但也许这就是你正在寻找的：https：//github.com/guidj/jsonuri-js – InferOn

从Json fabric加载js

回答

相关问题