GoJs - 导出包含远程图像的画布图的图像不包括远程图像

图包含来自远程服务器的图像。当使用diagram.makeImage（）将图导出为png时，它将从远程服务器中排除图像。但它与本地图像正常工作。GoJs - 导出包含远程图像的画布图的图像不包括远程图像

canvas screenshot
generated image using diagram.makeImage()

<html> 
<head> 
    <title>Gojs example</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gojs/1.6.7/go-debug.js"></script> 
</head> 
<body onload="init()"> 
<div id="sample"> 
    <div id="myDiagramDiv" style="border: solid 1px black; width:50%; height:500px"></div> 
    <div> 
     <button onclick="createImage()">create Image</button> 
    </div> 
</div> 
<script> 
    var $ = go.GraphObject.make; 
    var myDiagram = null; 
    function init() { 
     myDiagram = $(go.Diagram, "myDiagramDiv", 
      { 
       initialContentAlignment: go.Spot.Center, 
       layout: $(go.TreeLayout, { 
        angle: 90 
       }) 
      }); 

     myDiagram.nodeTemplate = 
      $(go.Node, "Auto", 
       $(go.Shape, { 
        "figure": "Rectangle", 
        width: 140, 
        height:140, 
        "fill": "#F5D9BD", 
        "stroke": "rgba(0, 0, 0, 1)", 
        "strokeWidth": 1.2, 
        "strokeJoin": "round", 
       } 
       ), 
       $(go.Picture, "https://cdn0.iconfinder.com/data/icons/communication-technology/500/black_envelope-128.png", 
        { width: 128, height: 128 } 
       ) 
      ); 
     myDiagram.model = new go.GraphLinksModel([{ key: "Alpha" }]); 
    } 

    function createImage() { 
     var newWindow = window.open("", "newWindow"); 
     if (!newWindow) return; 
     var newDocument = newWindow.document; 
     var png = myDiagram.makeImage({ 
      size: new go.Size(Infinity, Infinity), 
      scale: 1, 
      type: "image/png" 
     }); 
     newDocument.body.appendChild(png); 
    } 
</script>

来源

2017-09-06 saurav singh

这是一个CORS问题。地址：

sourceCrossOrigin: function() { return "anonymous"; }

要将图像设置。

  $(go.Picture, "https://cdn0.iconfinder.com/data/icons/communication-technology/500/black_envelope-128.png", 
       { sourceCrossOrigin: function() { return "anonymous"; }, width: 128, height: 128 } 
      )

工作例如：https://codepen.io/simonsarris/pen/xLNXEZ

来源

2017-09-06 18:50:26

GoJs - 导出包含远程图像的画布图的图像不包括远程图像

回答

相关问题