Wie erstellt man Farbverlauf in Svg Hintergrund

-1

Ich muss die Hintergrundfarbe in gegebenen Svg Kreis wie ein Bild unten .. .. wie diese Hintergrundfarbe mit Farbverlauf zu erreichen?Wie erstellt man Farbverlauf in Svg Hintergrund

Hinweis: nur Hintergrundfarbe für dieses Bild keine Notwendigkeit für Nadel, Tick und Label.

Probe-Link: http://jsfiddle.net/mkn9t627/4/

<svg height="500" width="500"> 
    <circle cx="150" cy="150" r="100" stroke="black" stroke-width="3" fill="transparent" /> 
</svg>

Quelle

2017-06-29 Akbar Basha

Sprechen Sie über den Hintergrund genau wie dargestellt (mit dem t Wo durchscheinende Kreise, und das helle Highlight) oder nur eines dieser drei Dinge? –

@PaulLeBeau Ja genau das ist, was ich brauche –

Fiddle: https://jsfiddle.net/oLsLdqas/1/

<svg height="250" width="500"> 
    <defs> 
    <radialGradient id="grad1" cx="50%" cy="50%" r="50%" fx="60%" fy="20%"> 
     <stop offset="0%" style="stop-color:rgb(0,0,0);stop-opacity:0" /> 
     <stop offset="100%" style="stop-color:rgb(1,1,1);stop-opacity:1" /> 
    </radialGradient> 
    </defs> 
    <circle cx="180" cy="100" r="100" fill="url(#grad1)" /> 

</svg>

Weitere Informationen dazu finden Link: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Gradients

Quelle

2017-06-29 12:28:44

Wie erstellt man Farbverlauf in Svg Hintergrund

Antwort

Verwandte Themen