Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> вывод/сохранение png, fabric.js
Kusss  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1355
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 4 дня
Карма: 77




Есть 2 холста.
canvas и canvas2
Рисуют в первом (миниатюра), а второй заполняю после нажатия кнопки (реальный размер).
canvas2.loadFromJSON(JSON.stringify(canvas), canvas2.renderAll.bind(canvas2), function(o, object) {
// тут масштабируем
fabric.log(o, object);
});

и после этой операции делаю
window.open(canvas2.toDataURL('png'));

и получаю пустой лист. :(
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Kusss  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1355
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 4 дня
Карма: 77




забыл написать.
изображение на втором холсте появляется.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Kusss  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1355
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 4 дня
Карма: 77




UP.
я уже не знаю как решить данную задачу.

https://jsfiddle.net/o9rh58vz/6/

Нужно при клике на копирование - сразу сохранить большой холст.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
kaww  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1755
Пользователь №: 20757
На форуме: 6 лет, 10 месяцев
Карма: 184




Цитата (Kusss @ 19.01.2016 - 06:09)
я уже не знаю как решить данную задачу.

Очевидно, что перед printPng должен быть вызван savePNG. https://jsfiddle.net/o9rh58vz/7/
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Kusss  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1355
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 4 дня
Карма: 77




Есть проблемка.... это работает когда мало объектов, и большой холст успевает сформироваться.
Если там что-то большое, результат пустота.

Похоже что loadFromJSON работает асинхронно, как выяснить что формирование завершено ?
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
kaww  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1755
Пользователь №: 20757
На форуме: 6 лет, 10 месяцев
Карма: 184




Kusss, гугл говорит, что вторым параметром в loadFromJSON можно передать callback-функцию
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Kusss  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1355
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 4 дня
Карма: 77




решил проблему с помощью отложенной загрузки функции

// Сохранить в PNG
function savePNG() {
var timer;
// информация с малого холста
var json = JSON.stringify(canvas);
original.loadFromJSON(json, original.renderAll.bind(original), function(o, object) {

// тут выполняем нужные преобразования

clearTimeout(timer);
timer = setTimeout(function(){
saveFile();
}, 500);
});
}


function saveFile(){
var data = original.toDataURL('image/png').replace(/data:image\/png;base64,/, '');
$.post('/upload/',{'save':data}, function(save){
window.open(save);
//window.location.href=save;
});
}
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса