Javascript JS/Jquery图像大小调整

我目前正在尝试动态检索图像的位置并将其加载到html5画布中。画布处于引导响应环境中，因此在文档准备就绪之前，我永远不知道画布的实际宽度。使用下面的代码，我已经设法调整图像和画布的大小，以满足我的需要，但图像质量非常差。我认为这是因为大幅缩小的大小，但再次不幸的是，我无法控制上传的原始图像的大小

function load_canvas_image(photo_type, vehicle_index) {

    image_location = get_image_location(photo_type, vehicle_index);

    var img = new Image();
    img.src = image_location;

    var canvas = $("#myCanvas")[0];
    var canvas_context = canvas.getContext("2d");

    canvas_width = canvas.width;
    canvas_height = canvas.height;

    img.onload = function() {
        cur_height = img.height;
        cur_width = img.width;

        aspect_ratio = cur_width/canvas_width;

        new_height = cur_height/aspect_ratio;

        canvas.height = new_height;
        canvas_context.drawImage(img, 0, 0, canvas.width, canvas.height);   
    }
};

$(document).on("change", "#add_damage_location", function() {
    load_canvas_image($(this).val(), $('#vehicle_index').val());
});

我希望有人知道如何使用类似的方法来减少图像的宽度和高度，使用类似的方法来减少图像的宽度和高度，同时尽可能保持图像的质量，我知道质量会有所下降，但在当前状态下，它是不可用的

---

提前谢谢

您看到这个问题/答案了吗？不幸的是，我确实进行了快速搜索，但没有找到它，我现在就来看看。谢谢