Object Fill

HelpXplain is the exciting new animated infographics and screencast tool that integrates with Help+Manual.

Moderators: Alexander Halser, Tim Green

Post Reply
Terry McMorrow
Posts: 14
Joined: Tue Jul 23, 2019 2:22 am

Object Fill

Unread post by Terry McMorrow »

I am trying to fill an object with color in CustomScripts but cannot figure out how.

I tried setting fill
xplain.animateTo('#shape10', 0, {fill: '#FFFF00'}, 0);

I tried setting Opacity to 0 and then do something like
xplain.animateTo('#shape10', 0, {fillOpacity 1}, 0); //Tried many iterations of FillOpacity

shape10.fill='blue';
shape10.fillColor='blue';
shape10.style.fill="blue";

Is it possible to set the fill color??
Thanks for your help
User avatar
Alexander Halser
EC-Software Support
Posts: 4098
Joined: Mon Jun 24, 2002 7:24 pm
Location: Salzburg, Austria
Contact:

Re: Object Fill

Unread post by Alexander Halser »

Addressing the shape itself won't work, because the shape is a compound object. #shape10 is the <div> tag, which contains an inline SVG, which further contains a <path> tag. You must address this <path> tag to change the fill. But you will need to write a JavaScript function to get to it. One thing you can rely on, is: there is exactly 1 <svg> in the <div> and the <svg> has exactly 1 <path>.
Alexander Halser
Senior Software Architect, EC Software GmbH
Terry McMorrow
Posts: 14
Joined: Tue Jul 23, 2019 2:22 am

Re: Object Fill

Unread post by Terry McMorrow »

Thanks Alexander - That led me down the right path

var x=shape10.getElementsByClassName("xplsvgpath");
x[0].style.fill='red';
x[0].style.fillOpacity=1;
Post Reply