我正在显示一个圆圈列表，但是其中一个圆圈比其他圆圈都大。我尝试用css和内联样式改变圆圈的宽度和高度，但没有任何效果。我在这里阅读了更多关于。svg的内容。我试着转换尺度属性，但这撤销了其他一些事情。圆的形状没有明确的宽度和高度吗?谢谢你的帮助。
我使用php回显svg。下面是我创建的.svg文件:
$gCircleX = 106.197;
$gCircleY = 104.197;
$gRad = 60.697;
$mCircleX = 106.197;
$mCircleY = 104.197;
$mRad = 60.697;
$x = 0;
$y = 0;
$id = 1;
$print .= '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="500px"
height="238px" viewBox="0 0 500 238" enable-background="new 0 0 500 238" xml:space="preserve">';
foreach($array as $value){
$print .= '<g id="Layer_'.$id.'">
<circle class="mon-slice" id="money'.$id.'" '.$scale.' fill="#009245" cx="'.$gCircleX.'" cy="'.$gCircleY.'" r="'.$gRad.'"/>
<text x="65" y="208">a date</text>
</g>
<g id="Layer_'.($id + 1).'" >
<circle class="mem-slice mem-16" fill="#333333" cx="'.$mCircleX.'" cy="'.$mCircleY.'" r="'.$mRad.'"/>
<path class="mem-slice mem-15" fill="#333333" transform="translate('.$x.', '.$y.')" d="M104,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049s-8.554-10.5-11.986-18.364
c-3.434-7.864-4.434-15.22-4.684-23.417s2.031-16.206,4.937-24.006c2.585-5.72,5.147-10.608,11.854-17.902
C72,51.25,79.699,49.104,79.699,49.104L104,104c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697
C165.895,119.25,157.125,164.75,104,164.895z"/>
<path class="mem-slice mem-14" fill="#333333" transform="translate('.$x.', '.$y.')" d="M104,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049s-8.554-10.5-11.986-18.364
c-3.434-7.864-4.434-15.22-4.684-23.417s2.031-16.206,4.937-24.006c2.585-5.72,5.147-10.608,11.854-17.902L104,104
c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697C165.895,119.25,157.125,164.75,104,164.895z"/>
<path class="mem-slice mem-13" fill="#333333" transform="translate('.$x.', '.$y.')" d="M104,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049s-8.554-10.5-11.986-18.364
c-3.434-7.864-4.434-15.22-4.684-23.417s2.031-16.206,4.937-24.006L104,104c0-33,0-60.5,0-60.5
c28.563,0,61.895,19.425,61.895,60.697C165.895,119.25,157.125,164.75,104,164.895z"/>
<path class="mem-slice mem-12" fill="#333333" transform="translate('.$x.', '.$y.')" d="M105,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049s-8.554-10.5-11.986-18.364
c-3.434-7.864-4.434-15.22-4.684-23.417L105,104c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697
C166.895,119.25,158.125,164.75,105,164.895z"/>
<path class="mem-slice mem-11" fill="#333333" transform="translate('.$x.', '.$y.')" d="M105,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049s-8.554-10.5-11.986-18.364L105,104
c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697C166.895,119.25,158.125,164.75,105,164.895z"/>
<path class="mem-slice mem-10" fill="#333333" transform="translate('.$x.', '.$y.')" d="M105,164.895
c-5.121-0.056-14.795-0.902-22.655-4.867c-8.608-4.342-15.896-9.022-20.175-14.049L105,104c0-33,0-60.5,0-60.5
c28.563,0,61.895,19.425,61.895,60.697C166.895,119.25,158.125,164.75,105,164.895z"/>
<path class="mem-slice mem-9" fill="#333333" transform="translate('.$x.', '.$y.')" d="M105,164.895
c-5.121-0.056-14.615-1.28-22.655-4.867L105,104c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697
C166.895,119.25,158.125,164.75,105,164.895z"/>
<path class="mem-slice mem-8" fill="#333333" transform="translate('.$x.', '.$y.')" d="M166.697,104.197
c0,33.521-26.697,60.697-60.697,60.697c0,0,0-27.176,0-60.697s0-60.697,0-60.697C140,43.5,166.697,70.676,166.697,104.197z"/>
<path class="mem-slice mem-7" fill="#333333" transform="translate('.$x.', '.$y.')" d="M131.521,159.511
L105,104c0-33,0-60.5,0-60.5c28.563,0,61.895,19.425,61.895,60.697C166.895,118.75,162.241,143.858,131.521,159.511z"/>
<path class="mem-slice mem-6" fill="#333333" transform="translate('.$x.', '.$y.')" d="M149.198,147.034
L106,104c0-33,0-60.5,0-60.5c28.563,0,59.532,19.447,60.895,60.697C167.062,109.266,166.92,129.75,149.198,147.034z"/>
<path class="mem-slice mem-5" fill="#333333" transform="translate('.$x.', '.$y.')" d="M163.112,125.334
L106,104c0-33,0-60.5,0-60.5c28.561,0,59.532,19.447,60.895,60.697C167.062,109.266,165.897,116.916,163.112,125.334z"/>
<path class="mem-slice mem-4" fill="#333333" transform="translate('.$x.', '.$y.')" d="M167.188,105H106
c0-33,0.197-61.5,0.197-61.5C140.197,43.5,167.385,70.25,167.188,105z"/>
<path class="mem-slice mem-3" fill="#333333" transform="translate('.$x.', '.$y.')" d="M160.561,77.475
L106,104.197c0-33.521,0-60.697,0-60.697S142.5,41.75,160.561,77.475z"/>
<path class="mem-slice mem-2" fill="#333333" transform="translate('.$x.', '.$y.')" d="M146.284,58.721
L106,104.197c0-33.521,0-60.697,0-60.697S127.5,41.875,146.284,58.721z"/>
<path class="mem-slice mem-1" fill="#333333" transform="translate('.$x.', '.$y.')" d="M126.143,46.854
L106,104.197c0-33.521,0-60.697,0-60.697S116.071,42.57,126.143,46.854z"/>';
$gCircleX = 106.197 * 4;
$gRad += 60.697;
$mCircleX = 106.197 * 4;
$mRad += 60.697;
$id += 2;
$x = 106.197 * 3;
$print .= "</g>";
}
$print .= "</svg>";我相信我已经找到你的问题了:
脚本底部的代码:
$gCircleX = 106.197 * 4;
$gRad += 60.697;
$mCircleX = 106.197 * 4;
$mRad += 60.697;
$id += 2;
$x = 106.197 * 3;
…可能不是你想的那样。
每次php遍历$数组时，它都会通过将数量添加到自身来增加半径。我不知道你的最终目标是什么，但试着把上面的代码改成下面的:
$gCircleX = 106.197 * 4;
$mCircleX = 106.197 * 4;
$id += 2;
$x = 106.197 * 3;
…通过删除两行代码