Вставить

Встраивание - это простой способ включить приложение на ваш сайт. Добавьте следующий код на ваш сайт:

<iframe src="https://butterfly.linwood.dev/embed" width="100%" height="500px" allowtransparency="true"></iframe>

Варианты

Вариант	Тип	По умолчанию	Описание
save	Boolean (true, false)	true	Включить сохранение. Если отключено, будет показана только кнопка выхода
editable	Boolean (true, false)	true	Включить редактирование. Если отключено, документ будет доступен только для чтения
language	Строка (..., система, пользователь)	system	Язык документа. Если система, то язык будет обнаружен из браузера. Если пользователь, язык будет установлен в предпочтение пользователей

События

Примеры его использования:

const embedElement = document.querySelector('#butterfly');
embedElement.addEventListener('message', (data) => {
  if(data.detail.type === 'save') {
    console.log('Сохранение...', data.detail.message);
  }
});

save

Событие сохранить производится, когда пользователь нажимает кнопку Сохранить.

Параметры:

• данные (Тип Список<int>): Данные документа.

exit

Событие выхода выдается, когда пользователь нажимает кнопку выхода.

Параметры:

• данные (Тип Список<int>): Данные документа.

change

Событие изменения создается при изменении пользователем.

Параметры:

• данные (Тип Список<int>): Данные документа.

Методы

Пример его использования:

const embedElement = document.querySelector('#butterfly');
embedElement.pushMessage('getData', {});
embedElement.addEventListener('message', (data) => {
  if(data.detail.type === 'getData') {
    console.log(data.detail.message);
  }
});

getData

Метод getData возвращает данные документа.

Нет параметров. Возвраты: Список<int>

setData

Метод setData устанавливает данные документа.

Параметры:

• данные (Тип Список<int>): Данные документа.

render

Метод превращает документ в изображение png.

Параметры:

• Ширина (Тип Номер): Ширина изображения.
• Высота (Тип Номер): Высота изображения.
• масштаб (Тип Номер): Масштаб изображения.
• renderBackground (Тип Логическое): Если введено значение true, фон будет отображен.

Возвращается: Строка (изображение с кодировкой Base64)

renderSVG

Метод renderSVG отображает документ на изображение в svg.

Параметры:

• Ширина (Тип Номер): Ширина изображения.
• Высота (Тип Номер): Высота изображения.
• renderBackground (Тип Логическое): Если введено значение true, фон будет отображен.

Возврат: Строка (SVG)