Svg.js Duplicate, Arrays, Merge












1















I'm new to SVG.js and to a concept in general, though I have a vector graphic background. So what I'm looking for is the understanding of the concept.



Duplicating, have found only the Array copy function, how to duplicate an object?
As an example:



element.rotate(45, 50, 50)


This rotates the element what if I want to keep a copy intact?



The Array itself. What is it? Doesn't looks like an Array in a graphic design program. What if I want simply to have a three raw array with five column of elements?



Merging. If I have an arc and line could I merge them to a path? Then rotate around an endpoint their copy and merge again to have the nice corners?



Maybe I ask too much but as a newcomer, I need some push forward.










share|improve this question























  • I've found clone method svgjs.com/docs/2.7/classes/#clone

    – Dmitriy Karpovich
    Nov 15 '18 at 12:51











  • There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

    – Dmitriy Karpovich
    Nov 15 '18 at 13:25













  • I have studied the topic a bit deeper looks like Merging is just impossible

    – Dmitriy Karpovich
    Nov 16 '18 at 8:06
















1















I'm new to SVG.js and to a concept in general, though I have a vector graphic background. So what I'm looking for is the understanding of the concept.



Duplicating, have found only the Array copy function, how to duplicate an object?
As an example:



element.rotate(45, 50, 50)


This rotates the element what if I want to keep a copy intact?



The Array itself. What is it? Doesn't looks like an Array in a graphic design program. What if I want simply to have a three raw array with five column of elements?



Merging. If I have an arc and line could I merge them to a path? Then rotate around an endpoint their copy and merge again to have the nice corners?



Maybe I ask too much but as a newcomer, I need some push forward.










share|improve this question























  • I've found clone method svgjs.com/docs/2.7/classes/#clone

    – Dmitriy Karpovich
    Nov 15 '18 at 12:51











  • There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

    – Dmitriy Karpovich
    Nov 15 '18 at 13:25













  • I have studied the topic a bit deeper looks like Merging is just impossible

    – Dmitriy Karpovich
    Nov 16 '18 at 8:06














1












1








1








I'm new to SVG.js and to a concept in general, though I have a vector graphic background. So what I'm looking for is the understanding of the concept.



Duplicating, have found only the Array copy function, how to duplicate an object?
As an example:



element.rotate(45, 50, 50)


This rotates the element what if I want to keep a copy intact?



The Array itself. What is it? Doesn't looks like an Array in a graphic design program. What if I want simply to have a three raw array with five column of elements?



Merging. If I have an arc and line could I merge them to a path? Then rotate around an endpoint their copy and merge again to have the nice corners?



Maybe I ask too much but as a newcomer, I need some push forward.










share|improve this question














I'm new to SVG.js and to a concept in general, though I have a vector graphic background. So what I'm looking for is the understanding of the concept.



Duplicating, have found only the Array copy function, how to duplicate an object?
As an example:



element.rotate(45, 50, 50)


This rotates the element what if I want to keep a copy intact?



The Array itself. What is it? Doesn't looks like an Array in a graphic design program. What if I want simply to have a three raw array with five column of elements?



Merging. If I have an arc and line could I merge them to a path? Then rotate around an endpoint their copy and merge again to have the nice corners?



Maybe I ask too much but as a newcomer, I need some push forward.







arrays merge copy svg.js






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 15 '18 at 12:07









Dmitriy KarpovichDmitriy Karpovich

167




167













  • I've found clone method svgjs.com/docs/2.7/classes/#clone

    – Dmitriy Karpovich
    Nov 15 '18 at 12:51











  • There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

    – Dmitriy Karpovich
    Nov 15 '18 at 13:25













  • I have studied the topic a bit deeper looks like Merging is just impossible

    – Dmitriy Karpovich
    Nov 16 '18 at 8:06



















  • I've found clone method svgjs.com/docs/2.7/classes/#clone

    – Dmitriy Karpovich
    Nov 15 '18 at 12:51











  • There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

    – Dmitriy Karpovich
    Nov 15 '18 at 13:25













  • I have studied the topic a bit deeper looks like Merging is just impossible

    – Dmitriy Karpovich
    Nov 16 '18 at 8:06

















I've found clone method svgjs.com/docs/2.7/classes/#clone

– Dmitriy Karpovich
Nov 15 '18 at 12:51





I've found clone method svgjs.com/docs/2.7/classes/#clone

– Dmitriy Karpovich
Nov 15 '18 at 12:51













There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

– Dmitriy Karpovich
Nov 15 '18 at 13:25







There is an experiment of mine codesandbox.io/s/pmqv6vxvw0 everything are in the HelloWorld.vue drawPath() method. What I want now is to fill the shape and to populate it as check board

– Dmitriy Karpovich
Nov 15 '18 at 13:25















I have studied the topic a bit deeper looks like Merging is just impossible

– Dmitriy Karpovich
Nov 16 '18 at 8:06





I have studied the topic a bit deeper looks like Merging is just impossible

– Dmitriy Karpovich
Nov 16 '18 at 8:06












2 Answers
2






active

oldest

votes


















0














The clone() method is your friend if you want to copy shapes.
You can read through the docs at svgjs.com to learn more.



For merging: No, that is not possible with svg.js albeit not impossible in general.
Its just that nobody requested this feature until now or nobody had the time to put their brain capacity into it to solve it.
There is a chance, that it gets considered, when you open a new issue and request that feature.
There is one problem with your idea though



// a line
canvas.line(0, 0, 200, 0)
<line x1="0" y1="0" x2="200", y2="0">

// an arc
canvas.path('M 200 0 A 100 100 0 0 200 200')
<path d="M 200 0 A 100 100 0 0 200 200">

// resulting path
canvas.path('M0 0 200 0 A 100 100 0 0 200 200')
<path d="M0 0 200 0 A 100 100 0 0 200 200">

// rotating the path
canvas.path('M0 0 200 0 A 100 100 0 0 200 200').rotate(90, 200, 200)
<path d="M0 0 200 0 A 100 100 0 0 200 200" transform="matrix(....)">


As you can see, rotating your path does not change the values of the d-attr. Rotation is a transformation which is done with the transform attribut. So you cannot easily merge these 2 paths together. Instead you first have to get rid of the transformation and apply it to every point directly. Then you can merge.
This ofc is again possible but maybe not something someone implemented already.
It would make a cool plugin, though...






share|improve this answer
























  • Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

    – Dmitriy Karpovich
    Nov 17 '18 at 15:09











  • Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

    – Fuzzyma
    Nov 17 '18 at 15:13











  • Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

    – Dmitriy Karpovich
    Nov 17 '18 at 15:18











  • You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

    – Fuzzyma
    Nov 17 '18 at 15:26











  • You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

    – Dmitriy Karpovich
    Nov 18 '18 at 18:57





















0














Answering my own question if someone one day needed this.



First of all the SVG.js and its kinds do not work with geometry they work with SVG. Learn SVG first than decide whether do you need them or not. In my case, Vue will do work simpler.



As for others:



Duplicating - all that the SVG provides in my case mostly <use>, but be careful with styles they are unchangeable.



Arrays - no such thing not as in a CG graphics editor, you should program them yourself. As I sad SVG.js only help you with SVG not with geometry



Merging - theoretically possible but there is no out of the box solution.






share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53319169%2fsvg-js-duplicate-arrays-merge%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    2 Answers
    2






    active

    oldest

    votes








    2 Answers
    2






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    The clone() method is your friend if you want to copy shapes.
    You can read through the docs at svgjs.com to learn more.



    For merging: No, that is not possible with svg.js albeit not impossible in general.
    Its just that nobody requested this feature until now or nobody had the time to put their brain capacity into it to solve it.
    There is a chance, that it gets considered, when you open a new issue and request that feature.
    There is one problem with your idea though



    // a line
    canvas.line(0, 0, 200, 0)
    <line x1="0" y1="0" x2="200", y2="0">

    // an arc
    canvas.path('M 200 0 A 100 100 0 0 200 200')
    <path d="M 200 0 A 100 100 0 0 200 200">

    // resulting path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200')
    <path d="M0 0 200 0 A 100 100 0 0 200 200">

    // rotating the path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200').rotate(90, 200, 200)
    <path d="M0 0 200 0 A 100 100 0 0 200 200" transform="matrix(....)">


    As you can see, rotating your path does not change the values of the d-attr. Rotation is a transformation which is done with the transform attribut. So you cannot easily merge these 2 paths together. Instead you first have to get rid of the transformation and apply it to every point directly. Then you can merge.
    This ofc is again possible but maybe not something someone implemented already.
    It would make a cool plugin, though...






    share|improve this answer
























    • Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

      – Dmitriy Karpovich
      Nov 17 '18 at 15:09











    • Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

      – Fuzzyma
      Nov 17 '18 at 15:13











    • Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

      – Dmitriy Karpovich
      Nov 17 '18 at 15:18











    • You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

      – Fuzzyma
      Nov 17 '18 at 15:26











    • You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

      – Dmitriy Karpovich
      Nov 18 '18 at 18:57


















    0














    The clone() method is your friend if you want to copy shapes.
    You can read through the docs at svgjs.com to learn more.



    For merging: No, that is not possible with svg.js albeit not impossible in general.
    Its just that nobody requested this feature until now or nobody had the time to put their brain capacity into it to solve it.
    There is a chance, that it gets considered, when you open a new issue and request that feature.
    There is one problem with your idea though



    // a line
    canvas.line(0, 0, 200, 0)
    <line x1="0" y1="0" x2="200", y2="0">

    // an arc
    canvas.path('M 200 0 A 100 100 0 0 200 200')
    <path d="M 200 0 A 100 100 0 0 200 200">

    // resulting path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200')
    <path d="M0 0 200 0 A 100 100 0 0 200 200">

    // rotating the path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200').rotate(90, 200, 200)
    <path d="M0 0 200 0 A 100 100 0 0 200 200" transform="matrix(....)">


    As you can see, rotating your path does not change the values of the d-attr. Rotation is a transformation which is done with the transform attribut. So you cannot easily merge these 2 paths together. Instead you first have to get rid of the transformation and apply it to every point directly. Then you can merge.
    This ofc is again possible but maybe not something someone implemented already.
    It would make a cool plugin, though...






    share|improve this answer
























    • Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

      – Dmitriy Karpovich
      Nov 17 '18 at 15:09











    • Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

      – Fuzzyma
      Nov 17 '18 at 15:13











    • Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

      – Dmitriy Karpovich
      Nov 17 '18 at 15:18











    • You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

      – Fuzzyma
      Nov 17 '18 at 15:26











    • You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

      – Dmitriy Karpovich
      Nov 18 '18 at 18:57
















    0












    0








    0







    The clone() method is your friend if you want to copy shapes.
    You can read through the docs at svgjs.com to learn more.



    For merging: No, that is not possible with svg.js albeit not impossible in general.
    Its just that nobody requested this feature until now or nobody had the time to put their brain capacity into it to solve it.
    There is a chance, that it gets considered, when you open a new issue and request that feature.
    There is one problem with your idea though



    // a line
    canvas.line(0, 0, 200, 0)
    <line x1="0" y1="0" x2="200", y2="0">

    // an arc
    canvas.path('M 200 0 A 100 100 0 0 200 200')
    <path d="M 200 0 A 100 100 0 0 200 200">

    // resulting path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200')
    <path d="M0 0 200 0 A 100 100 0 0 200 200">

    // rotating the path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200').rotate(90, 200, 200)
    <path d="M0 0 200 0 A 100 100 0 0 200 200" transform="matrix(....)">


    As you can see, rotating your path does not change the values of the d-attr. Rotation is a transformation which is done with the transform attribut. So you cannot easily merge these 2 paths together. Instead you first have to get rid of the transformation and apply it to every point directly. Then you can merge.
    This ofc is again possible but maybe not something someone implemented already.
    It would make a cool plugin, though...






    share|improve this answer













    The clone() method is your friend if you want to copy shapes.
    You can read through the docs at svgjs.com to learn more.



    For merging: No, that is not possible with svg.js albeit not impossible in general.
    Its just that nobody requested this feature until now or nobody had the time to put their brain capacity into it to solve it.
    There is a chance, that it gets considered, when you open a new issue and request that feature.
    There is one problem with your idea though



    // a line
    canvas.line(0, 0, 200, 0)
    <line x1="0" y1="0" x2="200", y2="0">

    // an arc
    canvas.path('M 200 0 A 100 100 0 0 200 200')
    <path d="M 200 0 A 100 100 0 0 200 200">

    // resulting path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200')
    <path d="M0 0 200 0 A 100 100 0 0 200 200">

    // rotating the path
    canvas.path('M0 0 200 0 A 100 100 0 0 200 200').rotate(90, 200, 200)
    <path d="M0 0 200 0 A 100 100 0 0 200 200" transform="matrix(....)">


    As you can see, rotating your path does not change the values of the d-attr. Rotation is a transformation which is done with the transform attribut. So you cannot easily merge these 2 paths together. Instead you first have to get rid of the transformation and apply it to every point directly. Then you can merge.
    This ofc is again possible but maybe not something someone implemented already.
    It would make a cool plugin, though...







    share|improve this answer












    share|improve this answer



    share|improve this answer










    answered Nov 17 '18 at 6:51









    FuzzymaFuzzyma

    3,03821336




    3,03821336













    • Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

      – Dmitriy Karpovich
      Nov 17 '18 at 15:09











    • Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

      – Fuzzyma
      Nov 17 '18 at 15:13











    • Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

      – Dmitriy Karpovich
      Nov 17 '18 at 15:18











    • You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

      – Fuzzyma
      Nov 17 '18 at 15:26











    • You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

      – Dmitriy Karpovich
      Nov 18 '18 at 18:57





















    • Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

      – Dmitriy Karpovich
      Nov 17 '18 at 15:09











    • Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

      – Fuzzyma
      Nov 17 '18 at 15:13











    • Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

      – Dmitriy Karpovich
      Nov 17 '18 at 15:18











    • You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

      – Fuzzyma
      Nov 17 '18 at 15:26











    • You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

      – Dmitriy Karpovich
      Nov 18 '18 at 18:57



















    Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

    – Dmitriy Karpovich
    Nov 17 '18 at 15:09





    Thank you, the transformation is an absolutely new conception for me. Do not understand why it is there under the hood anyway there are somewhere the absolute coordinates.

    – Dmitriy Karpovich
    Nov 17 '18 at 15:09













    Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

    – Fuzzyma
    Nov 17 '18 at 15:13





    Transformation is the most powerful tool in every graphical environment. You certainly know it from every image editing program. It's far easier to just take a shape and reuse it for multiple transformations or undo the transformation, stack transformations and so on. Changing all (possibly hundreds) of coordinates instead is a waste of Ressources

    – Fuzzyma
    Nov 17 '18 at 15:13













    Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

    – Dmitriy Karpovich
    Nov 17 '18 at 15:18





    Speaking about clone there is "use" as well looks like it is better but I have no idea how to apply multiple transformation in this case codesandbox.io/s/pmqv6vxvw0

    – Dmitriy Karpovich
    Nov 17 '18 at 15:18













    You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

    – Fuzzyma
    Nov 17 '18 at 15:26





    You would transform the use element itself. You might want considering reading up about svg before using svg. js. That will make a lot of things more clear

    – Fuzzyma
    Nov 17 '18 at 15:26













    You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

    – Dmitriy Karpovich
    Nov 18 '18 at 18:57







    You now, I have used to use the Grasshopper before. You always could get actual coordinates in there, I have expected the same level of abstraction from a js framework. For my naive point of view having under the hood pure geometrycal engine better than keeping in memory the same copy of the oddly described graphics. Anyway you of course right I have to learn before but you know when someone didn't get something fundamental reading documentation useless. This is what I'm trying to do, to get the basics.

    – Dmitriy Karpovich
    Nov 18 '18 at 18:57















    0














    Answering my own question if someone one day needed this.



    First of all the SVG.js and its kinds do not work with geometry they work with SVG. Learn SVG first than decide whether do you need them or not. In my case, Vue will do work simpler.



    As for others:



    Duplicating - all that the SVG provides in my case mostly <use>, but be careful with styles they are unchangeable.



    Arrays - no such thing not as in a CG graphics editor, you should program them yourself. As I sad SVG.js only help you with SVG not with geometry



    Merging - theoretically possible but there is no out of the box solution.






    share|improve this answer




























      0














      Answering my own question if someone one day needed this.



      First of all the SVG.js and its kinds do not work with geometry they work with SVG. Learn SVG first than decide whether do you need them or not. In my case, Vue will do work simpler.



      As for others:



      Duplicating - all that the SVG provides in my case mostly <use>, but be careful with styles they are unchangeable.



      Arrays - no such thing not as in a CG graphics editor, you should program them yourself. As I sad SVG.js only help you with SVG not with geometry



      Merging - theoretically possible but there is no out of the box solution.






      share|improve this answer


























        0












        0








        0







        Answering my own question if someone one day needed this.



        First of all the SVG.js and its kinds do not work with geometry they work with SVG. Learn SVG first than decide whether do you need them or not. In my case, Vue will do work simpler.



        As for others:



        Duplicating - all that the SVG provides in my case mostly <use>, but be careful with styles they are unchangeable.



        Arrays - no such thing not as in a CG graphics editor, you should program them yourself. As I sad SVG.js only help you with SVG not with geometry



        Merging - theoretically possible but there is no out of the box solution.






        share|improve this answer













        Answering my own question if someone one day needed this.



        First of all the SVG.js and its kinds do not work with geometry they work with SVG. Learn SVG first than decide whether do you need them or not. In my case, Vue will do work simpler.



        As for others:



        Duplicating - all that the SVG provides in my case mostly <use>, but be careful with styles they are unchangeable.



        Arrays - no such thing not as in a CG graphics editor, you should program them yourself. As I sad SVG.js only help you with SVG not with geometry



        Merging - theoretically possible but there is no out of the box solution.







        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Dec 12 '18 at 12:09









        Dmitriy KarpovichDmitriy Karpovich

        167




        167






























            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53319169%2fsvg-js-duplicate-arrays-merge%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            這個網誌中的熱門文章

            Tangent Lines Diagram Along Smooth Curve

            Yusuf al-Mu'taman ibn Hud

            Zucchini