用於角度SVG的CSS

Question

我對Angular和SVG非常陌生，我試圖讓我的圖形和關鍵/圖例出現在同一行上。

這是它目前的樣子：http://imgur.com/a/KUqo5

這裏是我的組件模板：

<svg height="100%" width="100%" [attr.viewBox]="viewBox"> 
    <g> 
     <circle *ngFor="let item of items;let i=index" [attr.cx]="center" 
     [attr.cy]="center" [attr.r]="radius" fill="transparent" 
     [attr.stroke-width]="width" [attr.stroke-dasharray]="perimeter" 
     [attr.stroke-dashoffset]="getOffset(i)" [attr.stroke]="item.color"/> 
    </g> 
</svg> 
<svg *ngFor="let item of items;" width="500" height="75"> 
    <circle cx="50" cy="50" r="20" [attr.fill]="item.color" /> 
    <text x="100" y="50">{{ item.count }}</text> 
</svg> 

任何建議，將不勝感激！

Answer 1

你必須使用<div>和一些CSS風格來對齊你的兩個svg數據。或html元素