Вопрос:

canvas.toDataURL () создает png, но я хочу, чтобы png имел определенные размеры

html5 express canvas png

124 просмотра

1 ответ

2434 Репутация автора

в основном png, который я создаю, всегда имеет размеры w 300 h 150, и мне нужны большие размеры. вот что я пытался сделать

  // this was my last trial I tried canging the width in the canvas tag
var newCanvas = $("<canvas/>", {"class" : "pic", "width" : "1000px", "height" :"300px"}).width(1000).height(500)
//  $(".mainContent").prepend(newCanvas);
// var canvasData = dataGatherer();
var canvas = newCanvas[0];
console.log(canvas)
var ctx = canvas.getContext("2d");
ctx.font = "30px Arial"
console.log("datum---TEST--",  datum)
ctx.fillText(datum.reviewText, 10, 50)
console.log(canvas.toDataURL())
datum.img = canvas.toDataURL();

где-нибудь на сервере:

   if(req.body.img){
        var img = req.body.img;
        data = img.replace(/^data:image\/\w+;base64,/, "");
        var buf = new Buffer(data, "base64");
        fs.unlink(__dirname + "/../public/another.png", function(){
            fs.writeFile(__dirname + "/../public/another.png", buf, {flag : "w"},function(){
                console.log("++++writen to file+++++")
            })
        });

    }
Автор: jack blank Источник Размещён: 22.08.2016 09:48

Ответы (1)


0 плюса

85989 Репутация автора

Решение

Вы должны изменить размер элемента canvas, если хотите, чтобы полученный .toDataURLразмер был изменен.

var canvas= document.createElement('canvas');

// resize the canvas element -- not it's CSS size
canvas.width=1000;
canvas.height=300;

...

// this dataURL will be 1000 x 300
var dataURL = canvas.toDataURL();
Автор: markE Размещён: 22.08.2016 09:55
Вопросы из категории :
32x32