Question

作为This question的后续，我在绘制实际画布时遇到问题。如果我将每个JSON对象项回显到控制台，它将返回与该项关联的值，并且我没有收到任何错误，所以我知道，根据我之前的问题，我正在成功读取JSON文件。那么，为什么画布上没有任何东西？

JS

$(document).ready(function(){
    var canvas = document.getElementById("schematic_holder");
    var ctx = canvas.getContext("2d");

    $.ajax({
        type: "GET",
        dataType: "json",
        url: "js/app/json/nst.json",
        success: function(result){
            var x1 = result[0].line.x1;
            var y1 = result[0].line.y1;
            var x2 = result[0].line.x2;
            var y2 = result[0].line.x2;
            var width = result[0].line.width;
            var stroke = result[0].line.stroke;
            console.log(x2);
            ctx.beginPath();
            ctx.moveTo(x1, y1);
            ctx.lineTo(x2, y2);
            ctx.lineWidth = width;
            ctx.strokeStyle = stroke;
            ctx.stroke();
        },
        complete: function(){
            console.log("Complete!");
        }
    })
})

JSON

[{
    "line": {
        "width": 3,
        "stroke": "#000000",
        "x1": 640.386,
        "y1": 258.163,
        "x2": 816.364,
        "y2": 258.163
    }   
}]

Answer 1

我创建了一个简单的文本案例，似乎你没有做错任何事情

http://jsfiddle.net/zoak2dm5/

canvas.width = canvas.height = 1000;

我猜你的画布太小或者看不见。

为什么我的线条没有画到画布上？

1 个答案: