svg图像在第二次刷新浏览器后加载到画布上

时间:2017-09-05 07:41:31

标签: javascript jquery html5-canvas fabricjs

我正在尝试在画布上加载已保存的svg,以便我可以再次修改并保存它。所以我在隐藏字段中获取数组并将该数组加载到画布中:

<input type="hidden" name="insert_arry" value='<?=htmlspecialchars($get_result[$insert])?>' id="insert_arry">
// script for loading the json array of svg on canvas
// loading the view of canvas here
opc_Canvas_Load(
  opc_View[opc_Current_View].path.replace('thumb','large'),
  opc_Current_View
  );
responsive_slide('opc_Product_Slider', 'pWrapper');
jq(window).resize(function() {
  opc_Canvas_Load(opc_OverlayImg, opc_Current_View);
});

// tried to load the div first of canvas using jquery, won't work
$(".handler-area").first().css('display', 'block');

// getting the array stored in to the hidden field
var insert_arry = jq('#insert_arry').val();

// loading the json array in canvas
canvas.loadFromJSON(insert_arry.substring(1, insert_arry.length - 1));

对象在画布上加载但在刷新浏览器后显示图像。这可能是图片加载问题,但无法找到确切解决问题。

1 个答案:

答案 0 :(得分:1)

 // Wow ... Aftera lot of try i m done with this task 
 ///// working code 

 var insert_arry = jq('#insert_arry').val(); 
 canvas.loadFromJSON(insert_arry.substring(1, insert_arry .length-1));
 var  img = new Image(); img.onload = function() { 
 opc_Canvas_Load(opc_View[opc_Current_View].path.replace(‌​'thumb', 'large'), 
 opc_Current_View); responsive_slide('opc_Product_Slider', 'pWrapper'); 
 jq(window).resize(function() { opc_Canvas_Load(opc_OverlayImg, opc_Current_View); }); }

很好!!!!!