仅当笔划宽度使用2px渲染时,Chrome中的裁剪SVG路径渲染问题

jgzswidk  于 2023-02-17  发布在  Go
关注(0)|答案(1)|浏览(157)

背景:

我正在绘制一个曲线图,路径超出了矩形蒙版/视图框,因为我需要在x轴上的一个小范围内设置缩放效果,所以路径相当大。

发行日期:

“放大”路径渲染为断开的笔划(请参见image B)。
问题仅在以下情况下发生:

  • 在Chrome和Mac上。
  • 渲染路径需要超过2个像素(如果笔划足够细,只需要一个像素渲染笔划就可以了-(参见image A)我在将窗口从低分辨率显示器移动到视网膜显示器时发现了这个问题。放大路径时也可以注意到这个问题。
  • 当路径很大并且“按比例缩小/仅显示视框内的一小部分”时。如果移除了视框区域以外的一些图,则路径正确呈现。

测试的其他浏览器:Safari、Firefox。(Mac)这些浏览器可以正确显示路径。

有人遇到过这个问题并知道任何修复方法吗?
我试过了,用一个细笔划,加上下拉阴影滤镜,这在低分辨率屏幕上很有用,但在变焦或一些不同分辨率设置的显示器上仍然会崩溃。只有阴影不起作用,因为它需要一个笔划来应用效果。
以下是代码编写人:https://codepen.io/althea16/pen/yLxLRBP

<svg viewBox="0 0 536 383" width="536" height="383"
    xmlns="http://www.w3.org/2000/svg">
    <g class="wrapper" transform="translate(40,20)">
        <g class="axis x" transform="translate(0,343)" fill="none" font-size="10" font-family="sans-serif"
            text-anchor="middle">
            <path class="domain text-divider" stroke="currentColor" d="M0,6V0H436.00848388671875V6"></path>
            <g class="tick text-secondary" opacity="1" transform="translate(22, 0)">
                <line stroke="currentColor" y2="6" class="hidden"></line><text fill="currentColor" y="9"
                    dy="0.71em">08:45</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(133, 0)">
                <line stroke="currentColor" y2="6" class="hidden"></line><text fill="currentColor" y="9" dy="0.71em">09
                    AM</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(244, 0)">
                <line stroke="currentColor" y2="6" class="hidden"></line><text fill="currentColor" y="9"
                    dy="0.71em">09:15</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(355, 0)">
                <line stroke="currentColor" y2="6" class="hidden"></line><text fill="currentColor" y="9"
                    dy="0.71em">09:30</text>
            </g>
        </g>
        <g class="axis y" fill="none" font-size="10" font-family="sans-serif" text-anchor="end">
            <path class="domain text-divider" stroke="currentColor" d="M-6,343.9985656738281H0V0H-6"></path>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 330)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.1</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 283)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.2</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 237)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.3</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 191)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.4</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 145)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.5</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 98)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.6</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 52)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.7</text>
            </g>
            <g class="tick text-secondary" opacity="1" transform="translate(0, 6)">
                <line stroke="currentColor" x2="-6" class="hidden"></line><text fill="currentColor" x="-9"
                    dy="0.32em">15.8</text>
            </g>
        </g>
        <defs>
            <clipPath id="clip">
                <rect width="440" height="345" transform="translate(0, -1)"></rect>
            </clipPath>
        
        </defs>
       
        <g class="lines" stroke="red" stroke-effect="non-scaling-stroke" stroke-width="2" clip-path="url(#clip)">
            <path
                d="M-3877882,7311C-3874338,7311,-3870794,7311,-3867250,7311C-3863706,7311,-3860162,7311,-3856618,7311C-3853074,7311,-3849530,7311,-3845986,7311C-3842442,7311,-3838898,7311,-3835354,7311C-3831810,7311,-3828266,7311,-3824722,7311C-3821178,7311,-3817634,7311,-3814090,7311C-3810546,7311,-3807002,7311,-3803458,7311C-3799914,7311,-3796370,7311,-3792826,7311C-3789281.9999999995,7311,-3785737.9999999995,7311,-3782193.9999999995,7311C-3778649.9999999995,7311,-3775105.9999999995,7311,-3771561.9999999995,7311C-3768017.9999999995,7311,-3764473.9999999995,7311,-3760929.9999999995,7311C-3757385.9999999995,7311,-3753841.9999999995,7311,-3750297.9999999995,7311C-3746753.9999999995,7311,-3743209.9999999995,7311,-3739666,7311C-3736122,7311,-3732578,7311,-3729034,7311C-3725490,7311,-3721946,7311,-3718402,7311C-3714858,7311,-3711314,7311,-3707770,7311C-3704226,7311,-3700682,7311,-3697138,7311C-3693594,7311,-3690050,7311,-3686506,7311C-3682962,7311,-3679418,7311,-3675874,7311C-3672330,7311,-3668786,7311,-3665242,7311C-3661698,7311,-3658154,7311,-3654610,7311C-3651066,7311,-3647522,7311,-3643978,7311C-3640434,7311,-3636890,7311,-3633346,7311C-3629802,7311,-3626258,7311,-3622714,7311C-3619170,7311,-3615626,7311,-3612082,7311C-3608538,7311,-3604994,7311,-3601450,7311C-3597906,7311,-3594362,7311,-3590818,7311C-3587274,7311,-3583730,7311,-3580186,7311C-3576642,7311,-3573098,7311,-3569554,7311C-3566010,7311,-3562466,7311,-3558922,7311C-3555378,7311,-3551834,7311,-3548290,7311C-3544746,7311,-3541202,7311,-3537657.9999999995,7311C-3534113.9999999995,7311,-3530569.9999999995,7311,-3527025.9999999995,7311C-3523481.9999999995,7311,-3519937.9999999995,7311,-3516393.9999999995,7311C-3512849.9999999995,7311,-3509305.9999999995,7311,-3505761.9999999995,7311C-3502217.9999999995,7311,-3498673.9999999995,7311,-3495130,7311C-3491586,7311,-3488042,7311,-3484498,7311C-3480954,7311,-3477410,7311,-3473866,7311C-3470322,7311,-3466778,7311,-3463234,7311C-3459690,7311,-3456146,7311,-3452602,7311C-3449058,7311,-3445514,7311,-3441970,7311C-3438426,7311,-3434882,7311,-3431338,7311C-3427794,7311,-3424250,7311,-3420706,7311C-3417162,7311,-3413618,7311,-3410074,7311C-3406530,7311,-3402986,7311,-3399442,7311C-3395898,7311,-3392354,7311,-3388810,7311C-3385266,7311,-3381722,7311,-3378178,7311C-3374634,7311,-3371090,7311,-3367546,7311C-3364002,7311,-3360458,7311,-3356914,7311C-3353370,7311,-3349826,7311,-3346282,7311C-3342738,7311,-3339194,7311,-3335650,7311C-3332106,7311,-3328562,7311,-3325018,7311C-3321474,7311,-3317930,7311,-3314386,7311C-3310842,7311,-3307298,7311,-3303754,7311C-3300210,7311,-3296666,7311,-3293122,7311C-3289578,7311,-3286033.9999999995,7311,-3282489.9999999995,7311C-3278945.9999999995,7311,-3275401.9999999995,7311,-3271857.9999999995,7311C-3268313.9999999995,7311,-3264769.9999999995,7311,-3261225.9999999995,7311C-3257681.9999999995,7311,-3254137.9999999995,7311,-3250593.9999999995,7311C-3247049.9999999995,7311,-3243505.9999999995,7311,-3239961.9999999995,7311C-3236417.9999999995,7311,-3232873.9999999995,7311,-3229329.9999999995,7311C-3225785.9999999995,7311,-3222241.9999999995,7311,-3218698,7311C-3215154,7311,-3211610,7311,-3208066,7311C-3204522,7311,-3200978,7311,-3197434,7311C-3193890,7311,-3190346,7311,-3186802,7311C-3183258,7311,-3179714,7311,-3176170,7311C-3172626,7311,-3169082,7311,-3165538,7311C-3161994,7311,-3158450,7311,-3154906,7311C-3151362,7311,-3147818,7311,-3144274,7311C-3140730,7311,-3137186,7311,-3133642,7311C-3130098,7311,-3126554,7311,-3123010,7311C-3119466,7311,-3115922,7311,-3112378,7311C-3108834,7311,-3105290,7311,-3101746,7311C-3098202,7311,-3094658,7311,-3091114,7311C-3087570,7311,-3084026,7311,-3080482,7311C-3076938,7311,-3073394,7311,-3069850,7311C-3066306,7311,-3062762,7311,-3059218,7311C-3055674,7311,-3052130,7311,-3048586,7311C-3045042,7311,-3041498,7311,-3037954,7311C-3034410,7311,-3030866,7311,-3027322,7311C-3023778,7311,-3020234,7311,-3016690,7311C-3013146,7311,-3009602,7311,-3006058,7311C-3002514,7311,-2998970,7311,-2995426,7311C-2991882,7311,-2988338,7311,-2984794,7311C-2981250,7311,-2977706,7311,-2974162,7311C-2970618,7311,-2967074,7311,-2963530,7311C-2959986,7311,-2956442,7311,-2952898,7311C-2949354,7311,-2945810,7311,-2942266,7311C-2938722,7311,-2935178,7311,-2931634,7311C-2928090,7311,-2924546,7311,-2921002,7311C-2917458,7311,-2913914,7311,-2910370,7311C-2906826,7311,-2903282,7311,-2899738,7311C-2896194,7311,-2892650,7311,-2889106,7311C-2885562,7311,-2882018,7311,-2878474,7311C-2874930,7311,-2871386,7311,-2867842,7311C-2864298,7311,-2860754,7311,-2857210,7311C-2853666,7311,-2850122,7311,-2846578,7311C-2843034,7311,-2839490,7311,-2835946,7311C-2832402,7311,-2828858,7311,-2825314,7311C-2821770,7311,-2818226,7311,-2814682,7311C-2811138,7311,-2807594,7311,-2804050,7311C-2800506,7311,-2796962,7311,-2793418,7311C-2789874,7311,-2786330,7311,-2782786,7311C-2779242,7311,-2775698,7311,-2772154,7311C-2768610,7311,-2765066,7311,-2761522,7311C-2757978,7311,-2754434,7311,-2750890,7311C-2747346,7311,-2743802,7311,-2740258,7311C-2736714,7311,-2733170,7311,-2729626,7311C-2726082,7311,-2722538,7311,-2718994,7311C-2715450,7311,-2711906,7311,-2708362,7311C-2704818,7311,-2701274,7311,-2697730,7311C-2694186,7311,-2690642,7311,-2687098,7311C-2683554,7311,-2680010,7311,-2676466,7311C-2672922,7311,-2669378,7311,-2665834,7311C-2662290,7311,-2658746,7311,-2655202,7311C-2651658,7311,-2648114,7311,-2644570,7311C-2641026,7311,-2637482,7311,-2633938,7311C-2630394,7311,-2626850,7311,-2623306,7311C-2619762,7311,-2616218,7311,-2612674,7311C-2609130,7311,-2605586,7311,-2602042,7311C-2598498,7311,-2594954,7311,-2591410,7311C-2587866,7311,-2584322,9332,-2580778,9332C-2577234,9332,-2573690,6012.999999999999,-2570146,5949C-2566602,5885,-2563058,5917,-2559514,5853C-2555970,5789,-2552426,3225,-2548882,3225C-2545338,3225,-2541794,5772,-2538250,5772C-2534706,5772,-2531162,3889.5,-2527618,2989C-2524074,2088.5,-2520530,985.6666666666666,-2516986,369C-2513442,-247.66666666666663,-2509898,-711,-2506354,-711C-2502810,-711,-2499266,263.33333333333337,-2495722,552C-2492178,840.6666666666665,-2488634,708.3333333333333,-2485090,1020.9999999999999C-2481546,1333.6666666666667,-2478002,3737,-2474458,3881C-2470914,4025,-2467370,3987,-2463826,4097C-2460282,4207,-2456738,4277,-2453194,4541C-2449650,4805,-2446106,5681,-2442562,5681C-2439018,5681,-2435474,5474.333333333332,-2431930,5394C-2428386,5313.666666666667,-2424842,5329,-2421298,5199C-2417754,5069,-2414210,3075,-2410666,3075C-2407122,3075,-2403578,3980,-2400034,3980C-2396490,3980,-2392946,3377.833333333333,-2389402,2854C-2385858,2330.1666666666665,-2382314,837,-2378770,837C-2375226,837,-2371682,1414,-2368138,1414C-2364594,1414,-2361050,841,-2357506,841C-2353962,841,-2350418,1826.8333333333335,-2346874,2619C-2343330,3411.1666666666665,-2339786,4864.833333333333,-2336242,5594C-2332698,6323.166666666666,-2329154,6994,-2325610,6994C-2322066,6994,-2318522,5326.166666666667,-2314978,4744C-2311434,4161.833333333333,-2307890,3800.166666666666,-2304346,3500.9999999999995C-2300802,3201.833333333333,-2297258,3317,-2293714,2949C-2290170,2581,-2286626,982,-2283082,982C-2279538,982,-2275994,1984,-2272450,1984C-2268906,1984,-2265362,-2244.6666666666665,-2261818,-2944C-2258274,-3643.333333333333,-2254730,-3992.9999999999995,-2251186,-3992.9999999999995C-2247642,-3992.9999999999995,-2244098,-2769,-2240554,-2769C-2237010,-2769,-2233466,-3447,-2229922,-3447C-2226378,-3447,-2222834,-1810,-2219290,-1810C-2215746,-1810,-2212202,-1996.6666666666667,-2208658,-2106C-2205114,-2215.3333333333335,-2201570,-2466,-2198026,-2466C-2194482,-2466,-2190938,1603,-2187394,1603C-2183850,1603,-2180306,1571.6666666666667,-2176762,1509C-2173218,1446.333333333333,-2169674,-1575.6666666666665,-2166130,-2576C-2162586,-3576.333333333333,-2159042,-4493,-2155498,-4493C-2151954,-4493,-2148410,-4178,-2144866,-4178C-2141322,-4178,-2137778,-5005,-2134234,-5005C-2130690,-5005,-2127146,-4076.333333333333,-2123602,-3923C-2120058,-3769.666666666666,-2116514,-3846.333333333333,-2112970,-3693C-2109426,-3539.666666666666,-2105882,-2787.333333333333,-2102338,-2596C-2098794,-2404.6666666666665,-2095250,-2309,-2091706,-2309C-2088162,-2309,-2084617.9999999998,-2321.666666666666,-2081073.9999999998,-2347C-2077529.9999999998,-2372.333333333333,-2073985.9999999998,-4339,-2070441.9999999998,-4339C-2066897.9999999998,-4339,-2063353.9999999998,-3494,-2059809.9999999998,-3494C-2056266,-3494,-2052722,-3680.6666666666665,-2049178,-4006C-2045634,-4331.333333333333,-2042090,-5446,-2038546,-5446C-2035002,-5446,-2031458,-3705.9999999999995,-2027914,-3705.9999999999995C-2024370,-3705.9999999999995,-2020826,-6174,-2017282,-6174C-2013738,-6174,-2010194,-6165,-2006650,-6165C-2003106,-6165,-1999562,-7385.333333333332,-1996018,-7747C-1992474,-8108.666666666666,-1988930,-7942.999999999999,-1985386,-8335C-1981842,-8727,-1978298,-11704,-1974754,-11704C-1971210,-11704,-1967666,-9294,-1964122,-9294C-1960577.9999999998,-9294,-1957033.9999999998,-10520,-1953489.9999999998,-10520C-1949945.9999999998,-10520,-1946401.9999999998,-8857.5,-1942857.9999999998,-8099.999999999999C-1939313.9999999998,-7342.5,-1935769.9999999998,-7154.666666666667,-1932226,-5975C-1928682,-4795.333333333333,-1925138,-1123.3333333333333,-1921594,-1021.9999999999999C-1918050,-920.6666666666665,-1914506,-870,-1910962,-870C-1907418,-870,-1903874,-2114,-1900330,-2114C-1896786,-2114,-1893242,-1568.9999999999998,-1889698,-1568.9999999999998C-1886154,-1568.9999999999998,-1882610,-2135,-1879066,-2135C-1875522,-2135,-1871978,-1491,-1868434,-1491C-1864890,-1491,-1861346,-2678,-1857802,-2678C-1854258,-2678,-1850714,1364,-1847170,1520C-1843626,1676,-1840082,1597.9999999999998,-1836538,1754C-1832993.9999999998,1910,-1829449.9999999998,3352,-1825905.9999999998,3352C-1822361.9999999998,3352,-1818817.9999999998,952,-1815273.9999999998,952C-1811730,952,-1808186,1938.9999999999998,-1804642,1938.9999999999998C-1801098,1938.9999999999998,-1797554,1918.333333333333,-1794010,1876.9999999999998C-1790466,1835.6666666666665,-1786922,1195,-1783378,1195C-1779834,1195,-1776290,1580.9999999999998,-1772746,1580.9999999999998C-1769202,1580.9999999999998,-1765658,1469.6666666666667,-1762114,1247C-1758570,1024.3333333333333,-1755026,164,-1751482,164C-1747938,164,-1744394,185,-1740850,227C-1737306,269,-1733762,2544,-1730218,2544C-1726674,2544,-1723130,1005,-1719586,841C-1716042,677,-1712498,759,-1708954,595C-1705409.9999999998,431,-1701865.9999999998,-1429.8333333333333,-1698321.9999999998,-2012.9999999999998C-1694777.9999999998,-2596.166666666667,-1691233.9999999998,-2904,-1687690,-2904C-1684146,-2904,-1680602,-2566,-1677058,-2566C-1673514,-2566,-1669970,-2832,-1666426,-2832C-1662882,-2832,-1659338,1308,-1655794,1308C-1652250,1308,-1648706,162,-1645162,162C-1641618,162,-1638074,2450,-1634530,2450C-1630986,2450,-1627442,2320.6666666666665,-1623898,2062C-1620354,1803.3333333333335,-1616810,589,-1613266,589C-1609722,589,-1606178,4182,-1602634,4182C-1599090,4182,-1595546,2707,-1592002,2707C-1588458,2707,-1584914,3032.666666666666,-1581369.9999999998,3357.9999999999995C-1577825.9999999998,3683.3333333333335,-1574281.9999999998,4659,-1570737.9999999998,4659C-1567193.9999999998,4659,-1563649.9999999998,1938.333333333333,-1560105.9999999998,1163C-1556561.9999999998,387.66666666666674,-1553017.9999999998,0,-1549474,0C-1545930,0,-1542386,353.33333333333337,-1538842,565C-1535298,776.6666666666666,-1531754,1270,-1528210,1270C-1524666,1270,-1521122,989,-1517578,989C-1514034,989,-1510490,1842,-1506946,1842C-1503402,1842,-1499858,1765.333333333333,-1496314,1612C-1492770,1458.6666666666667,-1489226,663,-1485682,663C-1482138,663,-1478594,714.3333333333334,-1475050,817C-1471506,919.6666666666665,-1467962,1138.5,-1464418,1451C-1460874,1763.5,-1457330,2692,-1453786,2692C-1450242,2692,-1446698,2032.1666666666667,-1443154,1516C-1439610,999.8333333333331,-1436066,-405,-1432522,-405C-1428978,-405,-1425434,-291.3333333333333,-1421890,-180C-1418346,-68.66666666666667,-1414802,196.33333333333331,-1411258,263C-1407714,329.66666666666663,-1404170,296.3333333333333,-1400626,363C-1397082,429.66666666666663,-1393538,730,-1389994,730C-1386450,730,-1382906,264,-1379362,264C-1375818,264,-1372274,2222.333333333333,-1368730,2525C-1365186,2827.666666666666,-1361642,2979,-1358098,2979C-1354554,2979,-1351010,2975,-1347466,2975C-1343922,2975,-1340378,3069.166666666666,-1336834,3147C-1333290,3224.833333333333,-1329746,3331.8333333333335,-1326202,3442C-1322658,3552.166666666666,-1319114,3808,-1315570,3808C-1312026,3808,-1308482,3601.666666666666,-1304938,3419C-1301394,3236.333333333333,-1297850,2712,-1294306,2712C-1290762,2712,-1287218,3307.8333333333335,-1283674,3664C-1280130,4020.166666666666,-1276586,4661,-1273042,4849C-1269498,5037,-1265954,5131,-1262410,5131C-1258866,5131,-1255322,4663.833333333333,-1251778,4529C-1248234,4394.166666666666,-1244690,4460,-1241146,4322C-1237602,4184,-1234058,3361,-1230514,3361C-1226970,3361,-1223426,4312,-1219882,4312C-1216338,4312,-1212794,2624.1666666666665,-1209250,1781C-1205706,937.8333333333333,-1202162,-747,-1198618,-747C-1195074,-747,-1191530,-87,-1187986,-87C-1184442,-87,-1180898,-1254,-1177354,-2568C-1173810,-3882,-1170266,-7970.999999999999,-1166722,-7970.999999999999C-1163178,-7970.999999999999,-1159634,-6260,-1156090,-6260C-1152546,-6260,-1149002,-6949.666666666667,-1145458,-7436.999999999999C-1141914,-7924.333333333332,-1138370,-9184,-1134826,-9184C-1131282,-9184,-1127738,-6041,-1124194,-5835C-1120650,-5629,-1117106,-5526,-1113562,-5526C-1110018,-5526,-1106474,-9113.333333333334,-1102930,-9194C-1099386,-9274.666666666666,-1095842,-9315,-1092298,-9315C-1088754,-9315,-1085210,-6710.333333333332,-1081666,-5971C-1078122,-5231.666666666666,-1074578,-5601.333333333333,-1071034,-4862C-1067490,-4122.666666666667,-1063946,192,-1060402,2893C-1056858,5594,-1053314,11344,-1049770,11344C-1046226,11344,-1042681.9999999999,4802,-1039137.9999999999,4802C-1035593.9999999999,4802,-1032049.9999999999,5863.333333333333,-1028506,6277C-1024962,6690.666666666666,-1021418,6810,-1017874,7284C-1014330,7758,-1010786,9121,-1007242,9121C-1003698,9121,-1000154,8240.833333333334,-996610,7929C-993066,7617.166666666667,-989522,7249.999999999999,-985978,7249.999999999999C-982433.9999999999,7249.999999999999,-978889.9999999999,7864.666666666666,-975345.9999999999,8048C-971801.9999999999,8231.333333333334,-968258,8350,-964714,8350C-961170,8350,-957626,8312,-954082,8304C-950538,8296,-946994,8292,-943450,8292C-939906,8292,-936362,10013.5,-932818,10545C-929274,11076.5,-925730,11481,-922186,11481C-918641.9999999999,11481,-915097.9999999999,10545.666666666666,-911553.9999999999,10080C-908009.9999999999,9614.333333333334,-904466,8967,-900922,8687C-897378,8407,-893834,8483.666666666666,-890290,8267C-886746,8050.333333333332,-883202,7387,-879658,7387C-876114,7387,-872570,7745,-869026,7745C-865482,7745,-861938,6658,-858394,6658C-854849.9999999999,6658,-851305.9999999999,7709,-847761.9999999999,7709C-844218,7709,-840674,7027.666666666667,-837130,6530C-833586,6032.333333333332,-830042,4723,-826498,4723C-822954,4723,-819410,5853,-815866,5853C-812322,5853,-808778,5534,-805234,5534C-801690,5534,-798146,6439,-794602,6439C-791057.9999999999,6439,-787513.9999999999,5455,-783969.9999999999,5455C-780425.9999999999,5455,-776882,5843.333333333333,-773338,5852C-769794,5860.666666666666,-766250,5856.333333333332,-762706,5865C-759162,5873.666666666667,-755618,7130.999999999999,-752074,7130.999999999999C-748530,7130.999999999999,-744986,6067,-741442,6067C-737898,6067,-734354,6487,-730810,6548.999999999999C-727266,6611,-723722,6580,-720178,6642C-716634,6704,-713090,7175.666666666666,-709546,7274.999999999999C-706002,7374.333333333333,-702458,7424,-698914,7424C-695370,7424,-691826,6477,-688282,6477C-684738,6477,-681194,6904.166666666667,-677650,7186C-674106,7467.833333333333,-670562,7513.333333333333,-667018,8167.999999999999C-663474,8822.666666666666,-659930,11566,-656386,11566C-652842,11566,-649298,10835,-645754,10835C-642210,10835,-638666,10849,-635122,10877C-631578,10905,-628034,12500,-624490,12500C-620946,12500,-617402,11245,-613858,11245C-610314,11245,-606770,11675,-603226,11675C-599682,11675,-596138,11283.666666666666,-592594,11219C-589050,11154.333333333332,-585506,11122,-581962,11122C-578418,11122,-574874,11129,-571330,11143C-567786,11157,-564242,11455,-560698,11455C-557154,11455,-553610,10960,-550066,10960C-546522,10960,-542978,11195.166666666666,-539434,11499C-535890,11802.833333333334,-532346,12783,-528802,12783C-525258,12783,-521713.99999999994,12779.999999999998,-518169.99999999994,12779.999999999998C-514626,12779.999999999998,-511082,13028,-507538,13028C-503994,13028,-500450,12991.999999999998,-496906,12958C-493361.99999999994,12924,-489817.99999999994,12913.333333333332,-486274,12824C-482730,12734.666666666666,-479186,12242.333333333332,-475642,12116.999999999998C-472098,11991.666666666666,-468554,12054.333333333332,-465010,11929C-461465.99999999994,11803.666666666664,-457921.99999999994,10960,-454378,10960C-450834,10960,-447290,11323,-443746,11323C-440202,11323,-436658,10822,-433114,10822C-429569.99999999994,10822,-426025.99999999994,10964,-422482,10964C-418938,10964,-415394,10308.166666666664,-411850,9967C-408306,9625.833333333332,-404762,9238.833333333332,-401218,8917C-397673.99999999994,8595.166666666666,-394129.99999999994,8314.333333333334,-390586,8036C-387042,7757.666666666666,-383498,7548.499999999999,-379954,7247C-376410,6945.5,-372866,6757.5,-369322,6227C-365778,5696.5,-362234,4857.5,-358690,4063.9999999999995C-355146,3270.5,-351602,1466,-348058,1466C-344514,1466,-340970,1881,-337426,1881C-333882,1881,-330338,1843,-326794,1843C-323250,1843,-319706,1950.9999999999998,-316162,2167C-312618,2383,-309074,3214.9999999999995,-305530,3214.9999999999995C-301986,3214.9999999999995,-298442,2718.833333333333,-294898,1935C-291354,1151.1666666666665,-287810,-1488,-284266,-1488C-280722,-1488,-277178,-625,-273634,-625C-270090,-625,-266546,-907.4999999999999,-263002,-1061C-259458,-1214.5,-255914,-1546,-252370,-1546C-248826,-1546,-245282,724,-241738,724C-238194,724,-234650,-965,-231105.99999999997,-965C-227562,-965,-224018,-755.9999999999999,-220474,-755.9999999999999C-216929.99999999997,-755.9999999999999,-213386,-1132,-209842,-1132C-206298,-1132,-202754,-829,-199209.99999999997,-829C-195666,-829,-192122,-2500,-188578,-2500C-185034,-2500,-181490,-202.99999999999997,-177946,-202.99999999999997C-174402,-202.99999999999997,-170858,-1412,-167314,-1813C-163770,-2214,-160226,-2609,-156682,-2609C-153138,-2609,-149594,-2176,-146050,-2176C-142506,-2176,-138962,-2633.5,-135418,-3037C-131874,-3440.5,-128330,-4597,-124785.99999999999,-4597C-121242,-4597,-117697.99999999999,-3547.333333333333,-114154,-3152.9999999999995C-110609.99999999999,-2758.666666666666,-107066,-2231,-103522,-2231C-99978,-2231,-96434,-3814,-92890,-3814C-89346,-3814,-85802,-3429.9999999999995,-82258,-2662C-78714,-1893.9999999999998,-75170,1306,-71626,1314C-68082,1322,-64537.99999999999,1326,-60993.99999999999,1326C-57450,1326,-53906,996,-50362,909.9999999999999C-46818,823.9999999999999,-43274,780.9999999999999,-39730,780.9999999999999C-36186,780.9999999999999,-32641.999999999996,1861,-29098,1861C-25554,1861,-22010,22,-18466,22C-12310.666666666668,22,-6155.333333333332,267,0,267C2.333333333333333,267,4.666666666666666,250,7,250C9.666666666666664,250,12.333333333333334,268.7047619047619,14.999999999999998,276C17.333333333333332,282.3833333333333,19.666666666666668,292,22,292C24.666666666666668,292,27.333333333333332,291,29.999999999999996,291C32.33333333333333,291,34.666666666666664,297.5,37,301C39.333333333333336,304.5,41.666666666666664,306.09722222222223,44,312C46.666666666666664,318.7460317460317,49.333333333333336,341,52,341C54.333333333333336,341,56.66666666666666,322,59,322C61.33333333333333,322,63.66666666666666,324,66,324C68.66666666666667,324,71.33333333333333,308,74,308C76.33333333333333,308,78.66666666666667,344,81,344C83.66666666666666,344,86.33333333333333,295,89,295C91.33333333333333,295,93.66666666666666,299,96,299C98.33333333333333,299,100.66666666666666,297.6666666666667,102.99999999999999,295C105.66666666666667,291.95238095238096,108.33333333333331,272.76190476190476,111,272C113.33333333333331,271.3333333333333,115.66666666666667,271,118,271C120.66666666666666,271,123.33333333333331,271,126,271C128.33333333333334,271,130.66666666666663,251.66666666666663,133,245C135.33333333333334,238.33333333333331,137.66666666666663,231,140,231C142.66666666666666,231,145.33333333333334,289,148,289C150.33333333333334,289,152.66666666666666,262.6666666666667,155,258C157.33333333333334,253.33333333333331,159.66666666666666,255.66666666666666,162,251C164.66666666666663,245.66666666666663,167.33333333333331,230.35238095238094,170,215C172.33333333333334,201.56666666666663,174.66666666666663,179.0722222222222,177,167C179.66666666666666,153.2031746031746,182.33333333333334,143.28571428571428,185,141C187.33333333333331,139,189.66666666666663,140,192,138C194.33333333333334,136,196.66666666666666,121.39722222222221,199,114C201.66666666666666,105.54603174603173,204.33333333333331,102.90793650793651,207,91C209.33333333333334,80.58055555555555,211.66666666666663,55.833333333333336,214,49.99999999999999C216.66666666666663,43.33333333333333,219.33333333333331,40,222,40C224.33333333333331,40,226.66666666666663,97,229,97C231.33333333333334,97,233.66666666666663,61,236,61C238.66666666666666,61,241.33333333333331,80,244,80C246.33333333333331,80,248.66666666666663,64,251,64C253.33333333333331,64,255.66666666666666,74,258,74C260.6666666666667,74,263.3333333333333,69,266,59C268.3333333333333,50.25,270.6666666666667,29.65555555555555,273,20C275.66666666666663,8.965079365079367,278.33333333333326,0,281,0C283.3333333333333,0,285.6666666666667,2.333333333333333,288,5C290.3333333333333,7.666666666666666,292.66666666666663,9.825,295,16C297.6666666666667,23.057142857142857,300.3333333333333,47,303,47C305.3333333333333,47,307.6666666666667,45.666666666666664,310,43C312.33333333333326,40.333333333333336,314.6666666666667,26,317,26C319.6666666666667,26,322.3333333333333,50.476190476190474,325,52C327.3333333333333,53.33333333333333,329.66666666666663,53.099999999999994,332,54C334.66666666666663,55.02857142857142,337.33333333333326,55.34603174603174,340,58C342.3333333333333,60.32222222222222,344.6666666666667,68,347,68C349.33333333333326,68,351.66666666666663,21,354,21C356.6666666666667,21,359.3333333333333,21,362,21C364.3333333333333,21,366.66666666666663,33.5,369,37C371.66666666666663,41,374.33333333333326,43,377,43C379.33333333333326,43,381.6666666666667,20,384,20C386.33333333333326,20,388.6666666666667,29.999999999999996,391,29.999999999999996C393.6666666666667,29.999999999999996,396.3333333333333,20,399,20C401.33333333333326,20,403.6666666666667,32,405.99999999999994,38C408.33333333333326,44,410.66666666666663,56,413,56C415.6666666666667,56,418.3333333333333,49.25714285714285,421,42C423.33333333333326,35.65,425.6666666666667,17,428,17C430.66666666666663,17,433.33333333333326,32,436,32C438.33333333333326,32,440.6666666666667,32,442.99999999999994,32"
                
                style="stroke: rgb(1, 204, 122); fill: none;"></path>
        </g>
       
    </g>
</svg>
dluptydi

dluptydi1#

有趣的问题。我自己看不出解决方案,但我已经尝试通过删除四舍五入的小数并将路径减少到最小值,将您所做的简化为一个非常简单的演示。
似乎是视图框外的路径导致了问题,即以下两个问题:

-3877882,100C-1067490,-4122,-1063946,192,-1060402,2893C-1056858,5594,-1053314,11344,-1049770,11344

但它不应该表现得那么差。我很想看看解决方案。Chrome对SVG太挑剔了。
https://codepen.io/PotatoTrade_/pen/eYLYbLe

相关问题