使用pngbase64字符串将图像绘制到画布中

Question

我正在尝试使用base64字符串在canvas中绘制图像也使用img大小调整画布大小但是它在这里不起作用是代码

**aspx code**



 <script src="../Scripts/MapGenerator/MapGeneraterScript.js"></script>
<asp:HiddenField ID="hiddenFieldMapBaseString" value="" runat="server" />
    <asp:HiddenField ID="hiddenFieldCanvasWidth" value="" runat="server" />
    <asp:HiddenField ID="hiddenFieldCanvasHeight" value="" runat="server" />
    <canvas id="canvasMasterPlan" style="border:solid;border-color:#353030;cursor:crosshair;" onclick="getImageCoords(event,this)">
    </canvas>

**code behind**

     System.Drawing.Image img = System.Drawing.Image.FromStream(new System.IO.MemoryStream(imgBytes));
    hiddenFieldCanvasHeight.Value = img.Height.ToString();
    hiddenFieldCanvasWidth.Value= img.Width.ToString();
    String base64String = Convert.ToBase64String(imgBytes);
    hiddenFieldMapBaseString.Value= String.Format("data:image/png;base64,{0}\"", base64String);
    ScriptManager.RegisterStartupScript(this, this.GetType(), "draw", "drawMap();", true);

**Javascript code**

var canvas = document.querySelector('canvas');
var c = canvas.getContext('2d');
strokestate = 0;
//Draw image into canvas
function drawMap() {
    c.width = document.getElementById("<%=hiddenFieldCanvasWidth.ClientID%>").value;
    c.height = document.getElementById("<%=hiddenFieldCanvasHeight.ClientID%>").value;
    var imageString = document.getElementById("<%=hiddenFieldMapBaseString.ClientID%>").value;
    c.drawImage(imageString, 0, 0);
}