Fabricjs: Предварительный просмотр баннера - PullRequest
Новая
       1

Fabricjs: Предварительный просмотр баннера

0 голосов
/ 25 июня 2018

Я использую fabricjs 1.5, и я застрял на 1 вещи. Я хочу показать предварительный просмотр холста пользователю по нажатию кнопки, и я не могу найти правильное решение. Некоторые вещи, которые приходили мне в голову:

  • Сохранить текущее состояние холста и затем отобразить его на другом холсте

  • Создать временную функцию сохранения изображения и затем показать это изображение

Но я хочу знать, есть ли какая-то конкретная функция в фабрике, которая может помочь мне достичь этого. Я занимался исследованиями и разработками и ничего не смог найти, поэтому ничего не пробовал.

1 Ответ

0 голосов
/ 25 июня 2018

Используйте canvas.toDataURL(), чтобы получить изображение холста, и установите его в качестве источника изображения.

DEMO 

var canvas = new fabric.Canvas('c');
canvas.add(new fabric.Circle({radius:100,fill:'red'}))
function setPreview(){
 document.getElementById('img').src = canvas.toDataURL();
}
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<button onclick="setPreview()">Preview</button><br>
<canvas id="c" width="200" height="200" style="border:1px solid #ccc"></canvas>
<br>
<img id='img'/>
...