Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only. Moving forward, myibi is our community platform to learn, share, and collaborate. We have the same Focal Point forum categories in myibi, so you can continue to have all new conversations there. If you need access to myibi, contact us at myibi@ibi.com and provide your corporate email address, company, and name.


Connect to myibi
Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [CLOSED] Change hover color of bar chart

Read-Only Read-Only Topic
Go
Search
Notify
Tools
[CLOSED] Change hover color of bar chart
 Login/Join
 
Member
posted
I have a vertical bar chart I'm working on and I have my color by field to have only 2 options (Picked/To Be Picked).

I've set the series colors to be Series 0 of Yellow and Series 1 of Green.

When I hover over the colors it is a very bright Yellow. I want to change that hover color to a blue color, but I can't figure out how to do that.

I've tried changing the Series All color to blue but I can't seem to figure out how to get the hover color to change.

Thanks.

This message has been edited. Last edited by: FP Mod Chuck,


WebFOCUS 8.1
 
Posts: 16 | Location: Voorhees, NJ | Registered: June 13, 2017Report This Post
Expert
posted Hide Post
Can you post an example ?


Waz...

Prod:WebFOCUS 7.6.10/8.1.04Upgrade:WebFOCUS 8.2.07OS:LinuxOutputs:HTML, PDF, Excel, PPT
In Focus since 1984
Pity the lost knowledge of an old programmer!

 
Posts: 6349 | Location: 33°49'23.0"S, 151°11'41.0"E | Registered: October 31, 2006Report This Post
Master
posted Hide Post
When you right click on the particular data point you see the "change color" option. Select that option and a color selection palette should pop up for you to select other color(s) to display.


Tomsweb
WebFOCUS 8.1.05M, 8.2.x
APP Studio, Developer Studio, InfoAssist, Dashboards, charts & reports
Apache Tomcat/8.0.36
 
Posts: 573 | Location: Baltimore, MD | Registered: July 06, 2006Report This Post
Gold member
posted Hide Post
Hey there Johnny,
Are you using a style sheet? If so, there could be a line of code in there that follows something like this;
,
htmlToolTip: { enabled: true, snap: false, sticky: true,
fill: 'rgba(255,255,255,1)',
border:{width: 0, color: 'rgba(150,150,150,0.95)'},
style: {
color: 'rgb(0,0,0)',
font: '8pt TREBUCHET MS',
cursor: 'default',
borderWidth: '0px',
padding: '6px 8px 6px 8px',
'borderRadius': 2}
},

It's the htmlToolTip that drives this behavior and its the fill: 'rgba(xxx,xxx,xxx,x)' that drives the hover color


Version: 8.2.03M, OS/Platform: Windows 7 & 10, Output: Excel, pdf, html
 
Posts: 63 | Location: Liberty Lake, WA - USA | Registered: June 23, 2016Report This Post
Member
posted Hide Post
Here's my sample code I have. Basically It makes it color green for series 0 and color yellow for series 1.

I tried the style sheet as described below but that didn't work.

When I hover over the bar charts it's a bright yellow color that I can't see or find in the code or the gui where to change.

*GRAPH_SCRIPT

setReportParsingErrors(false);
setSelectionEnableMove(false);
setDisplay(getY1MinorGrid(),false);
setGridCount(getY1MinorGrid(),1);
setDisplay(getO1MajorGrid(),false);
setTextFormatPreset(getDataText(),28);
setFontSizeAbsolute(getDataText(),true);
setAutofit(getDataText(),false);
setPlaceResize(getDataText(),0);
setFontSizeInPoints(getDataText(),15);
setDataTextPosition(4);
setDataTextDisplay(false);
setPieFeelerTextDisplay(1);
setDisplay(getDataText(1), true);
setLegendPosition(1);
setLegendReverse(true);
setFontSizeAbsolute(getLegendText(),true);
setAutofit(getLegendText(),false);
setPlaceResize(getLegendText(),0);
setFontName(getLegendText(),"TIMES NEW ROMAN");
setTextString(getY1Title()," ");
setDisplay(getY1Title(),true);
setTextString(getO1Title()," ");
setDisplay(getO1Title(),true);
setGradientPinPosition1(getSeries(1),1.0);
setFillType(getSeries(1),1);
setGradientNumPins(getSeries(1),3);
setGradientPinPosition0(getSeries(1),0.0);
setGradientPinPosition1(getSeries(1),0.5);
setGradientPinPosition2(getSeries(1),1.0);
setFillColor(getSeries(1), new Color(79,200,50,255));
setFillColor(getSeries(0),new Color(242,218,50));
setTransparentBorderColor(getSeries(0), true);
setTransparentBorderColor(getSeries(1), true);
setPieTilt(0);
setPieDepth(0);
setDepthRadius(0);
setDepthAngle(0);
setGradientPinPosition0(getFrame(),0.0);
setGradientPinLeftColor0(getFrame(),new Color(138,138,138));
setGradientPinRightColor0(getFrame(),new Color(138,138,138));
setGradientPinLeftColor2(getFrame(),new Color(138,138,138));
setGradientPinRightColor2(getFrame(),new Color(138,138,138));
setGradientPinLeftColor1(getFrame(),new Color(67,67,67));
setGradientPinRightColor1(getFrame(),new Color(67,67,67));
setGradientPinPosition2(getFrame(),1.0);
setGradientPinLeftColor1(getFrame(),new Color(23,23,23));
setGradientPinRightColor1(getFrame(),new Color(23,23,23));
setGradientPinLeftColor0(getFrame(),new Color(19,19,19));
setGradientPinRightColor0(getFrame(),new Color(19,19,19));
setGradientPinLeftColor2(getFrame(),new Color(19,19,19));
setGradientPinRightColor2(getFrame(),new Color(19,19,19));
setGradientPinLeftColor1(getFrame(),new Color(97,97,97));
setGradientPinRightColor1(getFrame(),new Color(97,97,97));
setGradientPinPosition1(getFrame(),1.0);
setGradientNumPins(getFrame(),3);
setGradientPinPosition1(getFrame(),0.5);
setGradientPinLeftColor0(getFrame(),new Color(58,58,58));
setGradientPinRightColor0(getFrame(),new Color(58,58,58));
setGradientPinLeftColor2(getFrame(),new Color(58,58,58));
setGradientPinRightColor2(getFrame(),new Color(58,58,58));
setGradientPinLeftColor0(getFrame(),new Color(77,77,77));
setGradientPinRightColor0(getFrame(),new Color(77,77,77));
setGradientPinLeftColor2(getFrame(),new Color(77,77,77));
setGradientPinRightColor2(getFrame(),new Color(77,77,77));
setGradientPinLeftColor0(getFrame(),new Color(107,107,107,191));
setGradientPinRightColor0(getFrame(),new Color(107,107,107,191));
setGradientPinLeftColor2(getFrame(),new Color(107,107,107,191));
setGradientPinRightColor2(getFrame(),new Color(107,107,107,191));
setGradientPinLeftColor1(getFrame(),new Color(22,22,22,191));
setGradientPinRightColor1(getFrame(),new Color(22,22,22,191));
setGradientPinLeftColor1(getFrame(),new Color(22,22,22));
setGradientPinRightColor1(getFrame(),new Color(22,22,22));
setGradientPinLeftColor0(getFrame(),new Color(107,107,107,217));
setGradientPinRightColor0(getFrame(),new Color(107,107,107,217));
setGradientPinLeftColor2(getFrame(),new Color(107,107,107,217));
setGradientPinRightColor2(getFrame(),new Color(107,107,107,217));
setGradientPinLeftColor0(getFrame(),new Color(107,107,107));
setGradientPinRightColor0(getFrame(),new Color(107,107,107));
setGradientPinLeftColor2(getFrame(),new Color(107,107,107));
setGradientPinRightColor2(getFrame(),new Color(107,107,107));
setGradientPinLeftColor0(getFrame(),new Color(110,110,110));
setGradientPinRightColor0(getFrame(),new Color(110,110,110));
setGradientPinLeftColor2(getFrame(),new Color(110,110,110));
setGradientPinRightColor2(getFrame(),new Color(110,110,110));
setFillColor(getChartBackground(),new Color(255,255,255));
setFillType(getChartBackground(),2);
setGradientPinPosition0(getChartBackground(),0.0);
setTransparentBorderColor(getChartBackground(),false);
setGradientDirection(getChartBackground(),4);
setGradientPinPosition2(getChartBackground(),1.0);
setGradientPinLeftColor0(getChartBackground(),new Color(109,109,109));
setGradientPinRightColor0(getChartBackground(),new Color(109,109,109));
setGradientPinLeftColor2(getChartBackground(),new Color(109,109,109));
setGradientPinRightColor2(getChartBackground(),new Color(109,109,109));
setGradientPinLeftColor1(getChartBackground(),new Color(36,36,36));
setGradientPinRightColor1(getChartBackground(),new Color(36,36,36));
setTransparentFillColor(getFrame(),true);
setGradientPinLeftColor0(getChartBackground(),new Color(135,135,135));
setGradientPinRightColor0(getChartBackground(),new Color(135,135,135));
setGradientPinLeftColor2(getChartBackground(),new Color(135,135,135));
setGradientPinRightColor2(getChartBackground(),new Color(135,135,135));
setGradientPinPosition1(getChartBackground(),1.0);
setGradientNumPins(getChartBackground(),3);
setGradientPinPosition1(getChartBackground(),0.5);
setFillColor(getY1Label(),new Color(255,255,255));
setFontStyle(getY1Label(),2);
setFontSizeAbsolute(getY1Label(), true);
setFontSizeInPoints(getY1Label(), 10);
setPlaceResize(getY1Label(), 0);
setFontSizeAbsolute(getO1Label(), true);
setFontSizeInPoints(getO1Label(), 10);
setPlaceResize(getO1Label(), 0);
setFontStyle(getO1Label(),2);
setFillColor(getO1Label(),new Color(255,255,255));
setFontStyle(getLegendText(),2);
setFillColor(getLegendText(),new Color(255,255,255));
setFontSizeInPoints(getLegendText(),10);
setGradientPinLeftColor0(getChartBackground(),new Color(108,108,108));
setGradientPinRightColor0(getChartBackground(),new Color(108,108,108));
setGradientPinLeftColor2(getChartBackground(),new Color(108,108,108));
setGradientPinRightColor2(getChartBackground(),new Color(108,108,108));
setFillType(getFrame(),2);
setShadowDisplay(getFrame(),false);
setGradientDirection(getFrame(),1);
setFillColor(getFrame(),new Color(0,0,0,0));
setTextRotation(getO1Label(),3);


WebFOCUS 8.1
 
Posts: 16 | Location: Voorhees, NJ | Registered: June 13, 2017Report This Post
Master
posted Hide Post
quote:
...When I hover over the bar charts it's a bright yellow color that I can't see or find in the code or the gui where to change...

Can you do a view source in your browser and check for the mouseOverIndicator property?

For example:
...
"mouseOverIndicator": {
 "enabled": true,
 "color": "yellow",
 "marker":{"size": 0}
  },
... 

If so, then perhaps the property is being set in a WebFOCUS StyleSheet?

This message has been edited. Last edited by: David Briars,
 
Posts: 822 | Registered: April 23, 2003Report This Post
Expert
posted Hide Post
If I remember correctly, the default for version 8.1 was the (awful imho Wink) yellow colour but with 8.2 the default has changed to an opacity which is much better (again imho).

David (previous post) has given you code the look for. I don't think that there was a GUI method of changing it so you are stuck with dropping into code.

There is the ability to turn hover effect off, just go to the Format tab and click on the HTML5 "Interactive options" icon. You will see a checkbox to "Enable Hover Over Effect". This will only enable or disable the hover over, it will not change colour of opacity.

If it is not in your actual procedure code then check in the STY file used.

If you tend to need the opacity change effect on hover over then I would suggest that you change it at STY level anyway so that you do not have to change every procedure. Just change 'yellow' to '70%' etc.

Warning don't forget that a new version install will overwrite any changes you make. So make a note of them so that you know what to change when you upgrade versions.

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [CLOSED] Change hover color of bar chart

Copyright © 1996-2020 Information Builders