2021-1-capstone-design1 / MAC_Project1

Go to a project
Toggle navigation Toggle navigation pinning
이정민
8ecc3b6c 1 parent fb39548c

gif 생성

Inline Side-by-side
Showing 2 changed files with 4 additions and 2 deletions
1 import { useEffect, useRef, useState } from "react"; 1 import { useEffect, useRef, useState } from "react";
2 import styled from "styled-components"; 2 import styled from "styled-components";
3 -import { GifGenerator } from "gif-generator/src";
4 import TuiImageEditor from "tui-image-editor"; 3 import TuiImageEditor from "tui-image-editor";
4 +import "gif-generator/dist/gif-generator";
5 5
6 const GifEditor = ({ previewURL }) => { 6 const GifEditor = ({ previewURL }) => {
7 // const [canvas, setCanvas] = useState<HTMLCanvasElement>(); 7 // const [canvas, setCanvas] = useState<HTMLCanvasElement>();
...@@ -59,6 +59,8 @@ const GifEditor = ({ previewURL }) => { ...@@ -59,6 +59,8 @@ const GifEditor = ({ previewURL }) => {
59 const gifGenerator = new GifGenerator(imageEditor._graphics.getCanvas()); 59 const gifGenerator = new GifGenerator(imageEditor._graphics.getCanvas());
60 gifGenerator.make().then( 60 gifGenerator.make().then(
61 (blob) => { 61 (blob) => {
62 + console.log("blob", blob);
63 + console.log(window.URL.createObjectURL(blob));
62 window.open(window.URL.createObjectURL(blob)); 64 window.open(window.URL.createObjectURL(blob));
63 }, 65 },
64 (error) => { 66 (error) => {
......
...@@ -51,7 +51,7 @@ export class GifGenerator { ...@@ -51,7 +51,7 @@ export class GifGenerator {
51 const objs = []; 51 const objs = [];
52 52
53 fabricObjs.map((fabricObj) => { 53 fabricObjs.map((fabricObj) => {
54 - if (fabricObj instanceof fabric.Path) { 54 + if (fabricObj.path !== undefined) {
55 objs.push(new Component.Brush(fabricObj)); 55 objs.push(new Component.Brush(fabricObj));
56 this.canvas.remove(fabricObj); 56 this.canvas.remove(fabricObj);
57 } else if (fabricObj.text !== undefined) { 57 } else if (fabricObj.text !== undefined) {
......