importing SVG from Ilustrator dont make clean lines

Solution for importing SVG from Ilustrator dont make clean lines
is Given Below:

I ve make an animation in html from a SVG ilustrator. But after making it, the stroke becomes ticker in some parts.*(I show you only a little part of the document itself)*Thanks

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=0.5">
        <title>Document</title>
    </head>
    <body>
    
    <style type="text/css">
    
    #sobreU{fill: rgb(182, 236, 222);
       stroke:#119094;
       stroke-width:1px;
       stroke-dashoffset:497.458 ;
       stroke-dasharray: 497.458;
       animation: line 2s ease-in-out forwards; 
    }
    
    @keyframes line{
       100%{
           stroke-dashoffset: 0;
       }
       0%{
       }
    }
    </style>
    
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="310px" height="200px"
    viewBox="120 120 1024 549" style="enable-background:new 0 0 1024 549;" xml:space="preserve 3d">
    
    <path id="sobreU"
            d="M683.1,186c14.1,7.5,21.9,17.4,21.9,28s-7.8,20.5-21.9,28c-14.6,7.7-33.7,11.4-52.9,11.4c-19.1,0-38.3-3.8-52.9-11.5c-14.4-7.6-22.2-17.7-22-28.5l28,0.2c-0.1,6.9,4.7,13.2,13.6,17.9c9.1,4.8,21.1,7.2,33.1,7.2
            s24-2.4,33.2-7.2c8.8-4.7,13.7-10.8,13.7-17.4c0-6.6-4.9-12.7-13.7-17.4c-8.8-4.6-20.8-7.2-33.2-7.2c-0.8,0-1.6,0-2.4,0l-0.1-14.9
            c1,0,1.9,0,2.8,0C650.3,174.5,668.9,178.5,683.1,186z"/>
    </path>
    
    </body>
    </html>

I think that if you are making an animated svg it would be for web use. Isn’t it?

If it is the case I suggest to avoid using the svg exported from Illustrator or Coreldraw as both over fill the svg code with rare and not clear code. My advice is to use Inkscape instead as it is a native svg editor. No matter Inkscape also add some code related to the software layout, it is very easy to clean it by opening the svg in a text editor and deleting all the extra code or using a library like SVGO which also have a free web app to accomplish that. See the tool here SVGOMG

I will provide two code versions of the same svg for you to understand what I’m saying.

This is how Inkscape saves the svg:

<?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"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="448.12128"
height="2239.0315"
id="svg2"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="animated.svg">
<metadata
id="metadata14">
 <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="defs12" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1366"
inkscape:window-height="702"
id="namedview10"
showgrid="false"
fit-margin-top="10"
fit-margin-left="10"
fit-margin-right="10"
fit-margin-bottom="10"
inkscape:zoom="0.061636364"
inkscape:cx="-3732.3292"
inkscape:cy="2149.3007"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg2" />
<path
style="fill:#0029b4;fill-opacity:1"
inkscape:connector-curvature="0"
d="m 11.13017,1988.6745 212.92999,240.357 212.92981,-240.357 z m 0,-1978.6745 425.8598,0 1.13131,242.01964 -428.12128,0 z m 0,338.49925 425.8598,0 0,1543.67415 -425.8598,0 z"
id="path8" />
</svg>

And this is the same svg after optimization:

<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" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="448.12128" height="2239.0315">
<path style="fill:#0029b4;fill-opacity:1" d="m 11.13017,1988.6745 212.92999,240.357 212.92981,-240.357 z m 0,-1978.6745 425.8598,0 1.13131,242.01964 -428.12128,0 z m 0,338.49925 425.8598,0 0,1543.67415 -425.8598,0 z"/>
</svg>

And this is your html with my svg in action:

    #sobreU{fill: rgb(182, 236, 222);
    stroke:#119094;
    stroke-width:2px;
    stroke-dashoffset:2150 ;
    stroke-dasharray: 2150;
    animation: line 2s ease-in-out forwards;
    }

    @keyframes line{
    100%{
        stroke-dashoffset: 0;
    }
    0%{
    }
    }
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=0.5">
        <title>Document</title>
    </head>
    <body>

    <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" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="1044" height="364">
    <path id="sobreU" d="M 923.0842,353.33646 1034,182.12299 923.0842,10.90966 Z M 10,353.33646 10,10.90966 121.68301,10 l 0,344.24521 z m 156.20465,0 0,-342.4268 712.34799,0 0,342.4268 z"/>
    </svg>

    </body>
    </html>

Also notice that the svg in your code lacks of the last closing tag </svg> and redeclares the close tag for path in here: 186z"/> </path> if you use the / at the end of the path d declaration then you can not use </path> because the / closes the tag. The page is displaying the svg because it is embeded into the html code and html is not so strict as svg does, but if you try to open the svg alone in the browser it will drop the following error message.

Sorry, my browser is in spanish

Hope being of any help and sorry for my English.