set Trianglify js for a SVG background

Question

i want to set Trianglify js for a SVG background but i can't. i can set for a div with the following codes :

        var something = document.getElementById('portfolio');
        var dimensions = something.getClientRects()[0];
        var pattern = Trianglify({
            width: dimensions.width,
            height: dimensions.height,
            x_colors: ['#444', '#555', '#666', '#777', '#888', '#999'],
            y_colors: 'match_x',
        });
        something.appendChild(pattern.canvas());

adriennetacke · Answer 1 · 2016-07-05T17:06:50.813

0

Edit: If you want to generate a trianglify design to use as your SVG background, you can use their Trianglify Generator. You can customize the pattern/design you want and then export to SVG or PNG.

Here's some info from the Github docs.

And from their main site:

var pattern = Trianglify();

//SVG DOM node
pattern.svg();

edited Jul 05 '16 at 17:06

answered Jul 01 '16 at 21:00

adriennetacke

1,726
1
14
21

no no i have a svg and i want to set trianglify for this svg background – Jul 02 '16 at 11:42
Do you want to generate a trianglify pattern/design and then save it as svg or png to use as your svg background? – adriennetacke Jul 04 '16 at 17:28
I updated my answer above. See where it has the bolded "Edit". :) – adriennetacke Jul 05 '16 at 17:06
i want to use trianglify for this svg background : https://jsfiddle.net/bv99Lexd/ – Jul 05 '16 at 17:45
Yes, so use the generator and then replace your source with the new trianglify pattern you just created... – adriennetacke Jul 05 '16 at 17:47

set Trianglify js for a SVG background

1 Answers1