D3：兩個類似的SVG大小圖片縮小

我爲我的項目廣告創建了兩個SVG圖標，現在試圖插入到我的頁面上。一切都很好，但有圖像縮小的問題。它們在incscape由大小相同的圖像製作，但是當我在頁面中插入他們，我得到這樣的：D3：兩個類似的SVG大小圖片縮小

我添加命令行來顯示什麼打算之一。其中一個圖像比另一個高。

這裏塊的代碼我使用：

<g transform="translate(0.36859130859375,0)"> 
<rect width="200" height="110" fill="#EBDEE9" x="735" y="258" style="cursor: pointer;"></rect> 
<image xlink:href="/media/com_myrod/images/woman-icon.svg" width="100" height="100" x="725" y="263"></image> 
<text font-size="16px" fill="black" class="rod-fname-text" x="820" y="283" style="cursor: pointer;"></text> 
<text font-size="16px" fill="black" class="rod-fname-text" x="820" y="301" style="cursor: pointer;"></text><text font-size="16px" fill="black" class="rod-fname-text" x="820" y="319" style="cursor: pointer;"></text> 
<text font-size="16px" fill="black" class="rod-fname-text" x="820" y="337" style="cursor: pointer;"></text><text font-size="16px" fill="black" class="rod-fname-text" x="820" y="351" style="cursor: pointer;"></text> 
</g>

另一圖像具有相同的代碼，但圖標的網址不同。

這裏SVG格式：

女人：

<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" 
    version="1.1" 
    id="svg836" 
    sodipodi:docname="woman-icon.svg" 
    inkscape:version="0.92.2 (5c3e80d, 2017-08-06)"> 
    <defs 
    id="defs830" /> 
    <sodipodi:namedview 
    id="base" 
    pagecolor="#ffffff" 
    bordercolor="#666666" 
    borderopacity="1.0" 
    inkscape:pageopacity="0.0" 
    inkscape:pageshadow="2" 
    inkscape:zoom="0.35" 
    inkscape:cx="-36.360817" 
    inkscape:cy="101.5839" 
    inkscape:document-units="mm" 
    inkscape:current-layer="layer1" 
    showgrid="false" 
    inkscape:window-width="1920" 
    inkscape:window-height="1017" 
    inkscape:window-x="-8" 
    inkscape:window-y="-8" 
    inkscape:window-maximized="1" /> 
    <metadata 
    id="metadata833"> 
    <rdf:RDF> 
     <cc:Work 
     rdf:about=""> 
     <dc:format>image/svg+xml</dc:format> 
     <dc:type 
      rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> 
     </cc:Work> 
    </rdf:RDF> 
    </metadata> 
    <g 
    inkscape:label="Layer 1" 
    inkscape:groupmode="layer" 
    id="layer1"> 
    <path 
     style="fill:#000000;stroke-width:0.48401597" 
     d="m 60.712789,275.27775 -3.790372,-0.37549 c -2.084698,-0.20652 -7.283975,-0.91204 -11.553924,-1.56781 -4.269963,-0.65577 -10.032395,-1.52294 -12.805414,-1.92702 -2.773005,-0.4041 -8.590237,-1.66064 -12.92718,-2.79235 C 10.4919,266.22901 9.9072264,265.82556 8.3966104,260.8597 6.3669354,254.18754 5.3639364,248.12322 5.0676134,240.73194 3.901584,211.64823 17.937067,183.24261 37.887745,174.30911 44.743584,171.2392 47.958746,170.59 57.563158,170.33622 l 8.650123,-0.22857 0.298706,4.10227 c 1.025701,14.08613 11.490456,26.79405 26.275905,31.90827 4.163278,1.44007 4.579118,1.48995 12.419828,1.48995 7.84073,0 8.25657,-0.0499 12.41985,-1.48995 14.76057,-5.10562 25.25042,-17.82524 26.27215,-31.85667 l 0.29495,-4.05069 h 7.07672 c 11.29853,0 18.64631,1.97683 26.66197,7.17305 21.99739,14.26004 32.4475,48.84701 24.32282,80.50183 -1.58658,6.1815 -3.02803,8.71506 -5.50486,9.67553 -7.07287,2.74273 -36.87123,7.33728 -57.68068,8.8937 -24.09799,-0.0218 -58.043765,1.83211 -78.357851,-1.17719 z M 94.637114,153.73797 c -1.892886,-0.36896 -4.658448,-0.90695 -6.145708,-1.19555 -3.773941,-0.73231 -10.823821,-3.47615 -15.487189,-6.02768 -16.036227,-8.77411 -26.838543,-22.76785 -29.985178,-38.84395 -1.131453,-5.78063 -0.985995,-9.454717 0.485765,-12.269539 0.898278,-1.718002 1.229136,-3.107832 1.229136,-5.163183 0,-9.05414 4.2599,-21.321907 10.663241,-30.708305 3.018013,-4.423972 12.166081,-13.289908 16.730834,-16.214841 7.475103,-4.789783 16.150884,-8.199359 24.419365,-9.596791 5.6655,-0.957514 16.57177,-0.957514 22.23727,0 21.20907,3.584485 39.53361,18.087079 47.5532,37.635017 2.29347,5.590401 3.69961,11.321836 4.08793,16.662438 0.22523,3.097744 0.63371,4.912473 1.4712,6.535957 1.40554,2.724693 1.55125,7.319337 0.41601,13.119247 -3.69769,18.89144 -18.21707,35.04984 -38.34334,42.67172 -5.55772,2.10474 -16.96215,4.55694 -16.96215,3.64725 0,-0.18395 0.83463,-0.4638 1.85472,-0.62188 1.02011,-0.15811 2.6196,-0.83434 3.55446,-1.50278 0.93484,-0.66845 3.25297,-1.66113 5.15138,-2.20598 7.89506,-2.2659 16.8799,-10.40755 21.75356,-19.71206 3.55075,-6.77894 5.05198,-12.70036 5.05141,-19.92477 -3.7e-4,-4.41879 -0.13435,-5.12736 -1.49788,-7.92072 -3.01643,-6.179572 -7.44472,-11.135475 -13.06138,-14.617608 -3.54806,-2.199668 -9.78095,-4.411832 -13.48887,-4.787433 l -2.87647,-0.291371 -4.26802,3.870051 C 105.96339,98.259782 87.258187,105.5757 71.826424,104.79612 c -2.867566,-0.14486 -6.311582,-0.59529 -7.653368,-1.00096 -1.888023,-0.57079 -2.525503,-0.60656 -2.819498,-0.15817 -0.651695,0.99397 -0.430311,11.0771 0.31805,14.48568 2.424587,11.04352 8.723737,20.76646 17.717275,27.34722 4.540223,3.3222 15.146881,8.06362 18.038447,8.06362 0.49347,0 0.8972,0.21442 0.8972,0.4765 0,0.26205 -0.0553,0.459 -0.12292,0.43764 -0.0676,-0.0213 -1.67164,-0.34072 -3.564506,-0.70968 z" 
     id="path1392" 
     inkscape:connector-curvature="0"/> 
    </g> 
</svg>

人：

<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" 
    version="1.1" 
    id="svg8" 
    sodipodi:docname="man-icon.svg" 
    inkscape:version="0.92.2 (5c3e80d, 2017-08-06)"> 
    <defs 
    id="defs2" /> 
    <sodipodi:namedview 
    id="base" 
    pagecolor="#ffffff" 
    bordercolor="#666666" 
    borderopacity="1.0" 
    inkscape:pageopacity="0.0" 
    inkscape:pageshadow="2" 
    inkscape:zoom="0.35" 
    inkscape:cx="-700.29561" 
    inkscape:cy="559.96269" 
    inkscape:document-units="mm" 
    inkscape:current-layer="layer1" 
    showgrid="false" 
    inkscape:window-width="1920" 
    inkscape:window-height="1017" 
    inkscape:window-x="-8" 
    inkscape:window-y="-8" 
    inkscape:window-maximized="1" /> 
    <metadata 
    id="metadata5"> 
    <rdf:RDF> 
     <cc:Work 
     rdf:about=""> 
     <dc:format>image/svg+xml</dc:format> 
     <dc:type 
      rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> 
     </cc:Work> 
    </rdf:RDF> 
    </metadata> 
    <g 
    inkscape:label="Layer 1" 
    inkscape:groupmode="layer" 
    id="layer1"> 
    <path 
     style="fill:#000000;stroke-width:0.476758" 
     d="M 82.876837,276.72443 C 48.21989,274.71322 29.861422,272.00912 13.749458,266.54233 5.5019066,263.74396 4.2423476,260.0288 5.3378746,241.7315 c 1.89833,-31.70539 9.3545544,-55.50855 20.3042014,-64.81874 7.069384,-6.0109 9.862655,-6.70646 26.770289,-6.66598 8.347482,0.0199 15.317831,0.192 15.489654,0.38225 0.171823,0.19023 0.579012,1.20369 0.904878,2.25213 7.011383,22.55906 39.690283,31.28016 60.803293,16.22673 5.76026,-4.10703 11.46707,-11.99431 12.4443,-17.19911 0.54513,-2.90338 29.13951,-2.52368 35.23768,0.46791 9.68858,4.75295 15.00204,11.97918 20.51973,27.90663 7.23724,20.89114 9.65421,56.94247 4.24794,63.36212 -2.9324,3.48205 -23.48945,8.3562 -46.21487,10.95769 -15.03369,1.72097 -58.227954,2.97669 -72.968133,2.1213 z M 97.900966,162.35269 c -15.741078,-4.17802 -31.516265,-21.8413 -35.499704,-39.74859 -0.437288,-1.9658 -1.511099,-4.96814 -2.386267,-6.67183 -3.817885,-7.4324 -4.978918,-18.342406 -2.362016,-22.195426 1.107628,-1.63082 1.107628,-1.63082 0.147876,-6.03987 -3.576537,-16.429523 0.06794,-29.91115 11.302486,-41.810493 12.412774,-13.147251 28.661745,-16.217409 49.162709,-9.289043 29.81165,10.074933 40.08273,25.585393 33.7265,50.930766 -1.24354,4.95857 -1.24354,4.95857 -0.26772,5.93359 3.13735,3.13474 2.36994,14.119476 -1.55318,22.232196 -0.88723,1.83475 -2.18505,5.37321 -2.88404,7.86323 -7.18383,25.59129 -30.40595,43.83333 -49.386604,38.79547 z" 
     id="path828" 
     inkscape:connector-curvature="0" /> 
    </g> 
</svg>

來源

2017-10-21 Vasilij Altunin

這兩個圖標文件都缺少大小信息。根據您的頁面顯示的用戶代理，結果可能會有所不同並且不一致。添加屬性

viewBox="5 30 200 250"

到兩個圖標文件。

來源

2017-10-21 14:14:48 ccprog

感謝它現在幫助他們是相同的大小。 –

D3：兩個類似的SVG大小圖片縮小

回答

相關問題