cancel
Showing results for 
Search instead for 
Did you mean: 

background color change of dynamic graphic

rohit_goel
Participant
0 Kudos

hi ,

i am using 3D Gauge dynamic graphic i want to change image backgrond color from white to blue.

thanks in advance.

regards,

rohit

Accepted Solutions (0)

Answers (3)

Answers (3)

Former Member
0 Kudos

You can add a <rect> tag, see text in bold below ...

<?xml version="1.0" encoding="UTF-8"?><svg height="300" text-rendering="geometricPrecision" width="300">

<rect height="299" id="Background" width="299" x="0" y="0" style="fill:none;stroke:rgb(0,255,0);stroke-width:1" />

<defs>

<radialGradient cx="70%" cy="30%" fx="80%" fy="40%" gradientUnits="objectBoundingBox" id="black-white_1" r="150%" spreadMethod="pad">

<stop offset="100%" stop-color="rgb(180,180,180)" stop-opacity="1"/>

<stop offset="100%" stop-color="rgb(0,0,0)" stop-opacity="0"/>

</radialGradient>

</defs>

<ellipse cx="150" cy="150" fill="url(#black-white_1)" rx="140" ry="140" stroke="rgb(0,0,0)" stroke-width="1"/>

<ellipse cx="150" cy="150" fill="none" rx="140" ry="140" stroke="url(#black-white_1)" stroke-width="4"/>

...

...

...

<line fill="none" id="Needle" stroke="rgb(255,20,20)" stroke-linecap="round" stroke-width="5" transform="rotate(330 150 150)" x1="150" x2="150" y1="150" y2="260"/>

</svg>

Regards.

jcgood25
Active Contributor
0 Kudos

You will need to clone the 3DDialGauge.svg object and create your own version of this, modifying the radialGradient rgb color attributes in the top section of the xml.

You can also look at the SVGSweepGauge as an example - it has a default black rectangle background which you could emulate as blue behind the 3DDial.

Edited by: Jeremy Good on Jan 21, 2009 9:20 AM

Former Member
0 Kudos