You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
where I have multiple copies of the same line of text (or copies of the canvas, etc). I can get blotter to work on a single line of text, but I've tried numerous methods of creating a copy and non of them work.
var elem1 = document.getElementById('distortion-text1')
var elem2 = document.getElementById('distortion-text2')
var elem3 = document.getElementById('distortion-text3')
var scope1 = blotter.forText(text);
var scope2 = blotter.forText(text);
var scope3 = blotter.forText(text);
scope1.appendTo(elem1);
scope2.appendTo(elem2);
scope3.appendTo(elem3);
I've also just tried cloning the canvas and that doesn't work. Blotter seems to just append one single canvas to the last dom node (distortion-text3), no matter what I do.
The text was updated successfully, but these errors were encountered:
I got this to work - but I feel like there should be a better method (or one you can control independently):
var textOptions = {
family : "'gtf_adieu_trialbold','EB Garamond', serif",
size : 50,
fill : "#220032",
paddingLeft : 40,
paddingRight : 40
};
var text = new Blotter.Text("WORK IN PROGRESS", textOptions);
var text2 = new Blotter.Text("WORK IN PROGRESS",textOptions);
var text3 = new Blotter.Text("WORK IN PROGRESS",textOptions);
var blotter = new Blotter(material, {
texts : [text,text2,text3]
});
var elem = document.getElementById('distortion-text')
var scope = blotter.forText(text);
var scope2 = blotter.forText(text2);
var scope3 = blotter.forText(text3);
scope.appendTo(elem);
scope2.appendTo(elem);
scope3.appendTo(elem);
The working example is the correct way to achieve this. The RenderScope objects Blotter instances return from forText just use basic JavaScript append and appendTo functions on the supplied DOM node, and that's just how they work.
If code repetition is annoying, you may also try building your texts, fetching their scopes, and appending them to their DOM elements in some kind of loop, but YMMV. I dont think that's really what youre after here though.
Hi - I want to achieve this effect:
where I have multiple copies of the same line of text (or copies of the canvas, etc). I can get blotter to work on a single line of text, but I've tried numerous methods of creating a copy and non of them work.
For example:
and
I've also just tried cloning the canvas and that doesn't work. Blotter seems to just append one single canvas to the last dom node (distortion-text3), no matter what I do.
The text was updated successfully, but these errors were encountered: