2016-08-26 4 views
0

Мне действительно нужен символ бесконечности в формате SVG, я знаю, что есть много онлайн, но они не нарисованы в инсульте, и я не могу найти тот, который заполняется: none; Я хочу анимировать штрих в значке SVG, так что .. кто-то может нарисовать или поделиться символом бесконечности SVG (или значок, если хотите), который нарисован в такте и ширине штриха и не заполняется ?! ниже символ имеет заполнения: # 000, поэтому он не может быть анимированным правильно помочь мне пожалуйста Как нарисовать символ бесконечности в формате SVG с инсультом не заполнять?

<svg class="logo-header-canvas" x="0px" y="0px" width="100px" height="100px" viewBox="0 0 100 100"> 
 
        <g> 
 
         <path class="logo-header-path" d="M39.213,35.87c-7.814-7.814-20.53-7.814-28.343,0C7.085,39.654,5,44.688,5,50.041s2.085,10.387,5.87,14.171 c3.785,3.785,8.818,5.87,14.172,5.87c5.353,0,10.386-2.085,14.171-5.87L64.04,39.385l0.136-0.128 c5.945-5.945,15.62-5.944,21.565,0.001c2.88,2.881,4.466,6.71,4.466,10.783c0,4.072-1.586,7.903-4.466,10.783 c-2.879,2.879-6.71,4.465-10.782,4.465c-4.074,0-7.902-1.586-10.781-4.465l-5.671-5.653c-0.938-0.937-2.454-0.937-3.392,0 c-0.936,0.938-0.936,2.454,0,3.393l6.067,6.043l0.011-0.001c3.733,3.536,8.603,5.477,13.766,5.477c5.354,0,10.387-2.085,14.171-5.87 C92.916,60.428,95,55.395,95,50.041s-2.084-10.387-5.87-14.171C85.346,32.084,80.313,30,74.959,30c-4.995,0-9.714,1.816-13.352,5.09 l-0.026-0.024L35.824,60.824c-2.881,2.879-6.71,4.465-10.783,4.465c-4.073,0-7.903-1.586-10.783-4.465 c-2.879-2.88-4.466-6.711-4.466-10.785c0-4.073,1.585-7.903,4.466-10.783c5.946-5.945,15.621-5.944,21.566,0.001l5.713,5.722 c0.938,0.935,2.453,0.935,3.392-0.001c0.937-0.937,0.937-2.453,0-3.391L39.213,35.87z" /> 
 
        </g> 
 
    </svg>

ответ

0

Не уверен, если вы по-прежнему нужен. Вот символ, основанный на вашем без заполнения.

Вы можете использовать Inkscape для внесения небольших изменений, подобных этим.

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 
<svg 
    xmlns:dc="http://purl.org/dc/elements/1.1/" 
    xmlns:cc="http://creativecommons.org/ns#" 
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" 
    xmlns:svg="http://www.w3.org/2000/svg" 
    xmlns="http://www.w3.org/2000/svg" 
    id="svg6" 
    version="1.1" 
    viewBox="0 0 100 100" 
    height="100px" 
    width="100px" 
    y="0px" 
    x="0px" 
    class="logo-header-canvas"> 
    <metadata 
    id="metadata12"> 
    <rdf:RDF> 
     <cc:Work 
     rdf:about=""> 
     <dc:format>image/svg+xml</dc:format> 
     <dc:type 
      rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> 
     <dc:title></dc:title> 
     </cc:Work> 
    </rdf:RDF> 
    </metadata> 
    <defs 
    id="defs10" /> 
    <g 
    style="stroke:#3676b8;stroke-opacity:1;fill:none;fill-opacity:1" 
    id="g4"> 
    <path 
     style="stroke:#3676b8;stroke-opacity:1;fill:none;fill-opacity:1" 
     id="path2" 
     d="M39.213,35.87c-7.814-7.814-20.53-7.814-28.343,0C7.085,39.654,5,44.688,5,50.041s2.085,10.387,5.87,14.171 c3.785,3.785,8.818,5.87,14.172,5.87c5.353,0,10.386-2.085,14.171-5.87L64.04,39.385l0.136-0.128 c5.945-5.945,15.62-5.944,21.565,0.001c2.88,2.881,4.466,6.71,4.466,10.783c0,4.072-1.586,7.903-4.466,10.783 c-2.879,2.879-6.71,4.465-10.782,4.465c-4.074,0-7.902-1.586-10.781-4.465l-5.671-5.653c-0.938-0.937-2.454-0.937-3.392,0 c-0.936,0.938-0.936,2.454,0,3.393l6.067,6.043l0.011-0.001c3.733,3.536,8.603,5.477,13.766,5.477c5.354,0,10.387-2.085,14.171-5.87 C92.916,60.428,95,55.395,95,50.041s-2.084-10.387-5.87-14.171C85.346,32.084,80.313,30,74.959,30c-4.995,0-9.714,1.816-13.352,5.09 l-0.026-0.024L35.824,60.824c-2.881,2.879-6.71,4.465-10.783,4.465c-4.073,0-7.903-1.586-10.783-4.465 c-2.879-2.88-4.466-6.711-4.466-10.785c0-4.073,1.585-7.903,4.466-10.783c5.946-5.945,15.621-5.944,21.566,0.001l5.713,5.722 c0.938,0.935,2.453,0.935,3.392-0.001c0.937-0.937,0.937-2.453,0-3.391L39.213,35.87z" 
     class="logo-header-path" /> 
    </g> 
</svg> 
Смежные вопросы