Fabric Js port to Construct.

Post your work in progress addons and get feedback

Post » Thu Aug 03, 2017 1:25 am

I have been working on porting Fabric.Js to Construct 2 i have been stuck in linking the canvas to Fabric canvas. but i got it solved by using @rexrainbow Fabric.js plugin as a reference , i was happy when i found he made that plugin because i have been looking for a solution for some days.

i have done some nice progress. ( i know he already done a fabricJS plugin but it was very basic and lack most of the features. and basic canvas features , so i had to make my own that serve my needs.

but i was stuck again with a problem and i wish @rexrainbow can help me. i used another fabricJs extension called Fabric-brush.js
which is a small library or custom brushes the problem is , after i draw with this library in free Drawing mode i try to export my image using toDataUrl or toSVG ... all i get is the basic shapes that i drawn like rectangle but not the Brush drawing and also it gets erased from the canvas.


please see the images on my drive to see how i implemented the function for free drawing , and screenshot of the problem.

https://drive.google.com/open?id=0B3inO ... ExFSldXUGs
B
12
S
6
Posts: 118
Reputation: 1,466

Post » Thu Aug 03, 2017 2:23 am

@warville

I would like to make another behavior for Fabric-brush.js, get fabricCanvas from host plugin by
Code: Select all
this.fabricCanvas = this.inst.fabricCanvas;
under Fabric-brush behavior.

But this suggestion might not solve your problem, I did not get enough information from your snapshot of code.
B
108
S
26
G
258
Posts: 4,430
Reputation: 145,179

Post » Thu Aug 03, 2017 2:52 am

@rexrainbow i will upload the source files of the plugin in the same folder , i do not intend to make it as a separate behavior , i actually included the fabric-brush.js in the same plugin.

here are the files , also note i have another problem with converting to SVG , it works when the canvas is empty but when i insert a rectangle it gives me an error , t.Match is not a function.


https://drive.google.com/drive/folders/ ... sp=sharing

i also added an example capx which include most of the features i added . it wasn't for share purpose so it must be confusing , it is for me to test on the go my plugin functions.
B
12
S
6
Posts: 118
Reputation: 1,466

Post » Thu Aug 03, 2017 3:34 am

@warville

Modify code like
this.fabricCanvas["toSVG"]()

Sorry I don't have time to review your code deeply.
B
108
S
26
G
258
Posts: 4,430
Reputation: 145,179


Return to Work in Progress Addons

Who is online

Users browsing this forum: No registered users and 1 guest