Focal Point
[CLOSED]Looking for help with Conditional formatting of Stacked Bar sections

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/4477028286

June 20, 2016, 11:53 AM
Reiter
[CLOSED]Looking for help with Conditional formatting of Stacked Bar sections
Hello

This is my first post so I apologize in advance for any missed standard practices within the forum.

My question is regarding stacked bar graphs. I've been tasked to build a graph where each section of the stacked bar is held to it's own set of conditional formatting. I have been successful in conditionally formatting the entire bar, but this doesn't give the desired effect. Is there a particular graph type I should use to achieve this effect or is these an option I'm missing that could allow for this?

Thank you in advance.
~don

This message has been edited. Last edited by: <Emily McAllister>,


WebFOCUS 8.1.0.5 DS, learning AS
Windows, All Outputs
June 20, 2016, 01:19 PM
CoolGuy
Reiter,

First off, welcome to the forums! Hope to see you a lot more as time goes on.

So, you are working with a vertical stacked bar graph and want to conditionally format each section of each bar right? I haven't used a stacked bar graph yet myself, but there are a lot of options to play with when working with graphs in the documentation.

Graph docs

Can you post and show us your existing code so we can better give you some suggestions?
(Note: Use the angle bracket icon up top to paste your code within so we can read it better than if you were to plain post it. Thanks!)

Thanks!


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
June 20, 2016, 02:18 PM
Reiter
below is some simple code to show an equivalent to
what I am working with.
I would like to give a set of traffic light conditional formatting to each section.
For instance if coffee is less than .6 mil
turn red, if between .6 and .8 turn yellow
and if greater than .8 turn green. Then some other
three tier set for FOOD and GIFTS.
But I can only treat each bar as a single item to condition.

DEFINE FILE GGSALES
YearMo/I6YYM=DATECVT(DATE, 'I8YYMD', 'I6YYM');
END
TABLE FILE GGSALES
SUM 
     DOLLARS
BY  LOWEST YearMo
BY  LOWEST CATEGORY
ON TABLE NOTOTAL
ON TABLE HOLD AS HOLD1
ON TABLE SET STYLE *
$
ENDSTYLE
END
-*IA_GRAPH_BEGIN
-*Do not delete or modify the comments below
*-INTERNAL_COMMENT LINE#0$PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8IS0tMS4wLS0+DQo8Um9vdCB2ZXJzaW9uPSIxLjAiPg0KICAgIDxPYmplY3Qgb2JqZWN0SWQ9IkNoYXJ0XzEiPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iTGlua2VkU29ydHMiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciLz4NCiAgICA8L09iamVjdD4NCiAgICA8T2JqZWN0IG9iamVjdElkPSJHTE9CQUwiPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iU2FtcGxlRGF0YSIgdHlwZT0iamF2YS5sYW5nLkJvb2xlYW4iPmZhbHNlPC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9Ikdsb2JhbFJlY29yZExpbWl0IiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj41MDA8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsUnVuUmVjb3JkTGltaXQiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPjA8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsT3B0aW1pemF0aW9uIiB0eXBlPSJqYXZhLmxhbmcuQm9vbGVhbiI+dHJ1ZTwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJmaWVsZERpc3BsYXlNb2RlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5sYWJlbDwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJwcmVmaXhEaXNwbGF5TW9kZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyIvPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iQWN0aXZlX1N0eWxlX1VzZXJfdHlwZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+cG93ZXI8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsVmFsdWVzUGFnaW5nIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj40PC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9IkZvY2V4ZWNQcmVmZXJlbmNlcyIgdHlwZT0iTWFwIj4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImF1dG9EcmlsbFNjcmlwdCIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyIvPg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUVkaXRNb2RlSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5mYWxzZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5Rm9ybWF0VGFiSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj50cnVlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlIb21lVGFiSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5mYWxzZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5UXVpY2tBY2Nlc3NUb29sYmFyU2F2ZUluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+dHJ1ZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJtZXRhZGF0YV92aWV3cyIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+TWV0YURhdGFUcmVlLlZJRVdfRElNUzwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5UmVzb3VyY2VzRmllbGRUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlJbnNlcnRUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTbGljZXJzVGFiRWRpdEluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0icnVuT25TdGFydHVwRGVmZXJyZWRJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTZXJpZXNUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImluZm9Bc3Npc3RNb2RlQWxsb3dlZEluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGVmYXVsdF9wcmV2aWV3X3BhZ2VsaW1pdF9sYXlvdXQiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPjE8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGVmYXVsdF9wcmV2aWV3X3BhZ2VsaW1pdCIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+NTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkZWZhdWx0X2NvbXBvc2VfZm9ybWF0IiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5QREY8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUludGVyYWN0aXZlTW9kZUluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+dHJ1ZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJydW5PblN0YXJ0dXBJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPnRydWU8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheURhdGFUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTbGljZXJzVGFiSW50ZXJhY3RpdmVJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPnRydWU8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUxheW91dFRhYkluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICA8L1Byb3BlcnR5Pg0KICAg
*-INTERNAL_COMMENT LINE#1$ICAgICA8UHJvcGVydHkgbmFtZT0iY2FzY2FkZU5hbWVzIiB0eXBlPSJNYXAiLz4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9Ik1hc3Rlcl9GaWxlcyIgdHlwZT0iU2V0Ij4NCiAgICAgICAgICAgIDxFbnRyeSB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5IT0xEMTwvRW50cnk+DQogICAgICAgIDwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJtZXRhZGF0YVZpZXdBcyIgdHlwZT0iTWFwIj4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9IkhPTEQxIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5NZXRhRGF0YVRyZWUuVklFV19MSVNUPC9FbnRyeT4NCiAgICAgICAgPC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9ImVuYWJsZVByZXZpZXciIHR5cGU9ImphdmEubGFuZy5Cb29sZWFuIj50cnVlPC9Qcm9wZXJ0eT4NCiAgICA8L09iamVjdD4NCjwvUm9vdD4NCg==
-*Do not delete or modify the comments above
ENGINE INT CACHE SET ON
-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';
-DEFAULTH &WF_TITLE='WebFOCUS Report';
GRAPH FILE HOLD1
-* Created by Info Assist for Graph
SUM HOLD1.HOLD1.DOLLARS
BY HOLD1.HOLD1.CATEGORY
ACROSS HOLD1.HOLD1.YearMo
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET GRWIDTH 1
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 1
ON GRAPH SET GRXAXIS 1
ON GRAPH SET LOOKGRAPH VBRSTK1
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0); 
setCurveFitEquationDisplay(false); 
setPlace(true); 
*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
*END
ENDSTYLE
END
-RUN
 
-*IA_GRAPH_FINISH
  

This message has been edited. Last edited by: Reiter,


WebFOCUS 8.1.0.5 DS, learning AS
Windows, All Outputs
June 20, 2016, 05:23 PM
CoolGuy
So, for manipulating individual series, there are docs here on such:

Series formatting

Run the following code, and you will see that we've managed to change your graph coloring:

DEFINE FILE GGSALES
YearMo/I6YYM=DATECVT(DATE, 'I8YYMD', 'I6YYM');
END
TABLE FILE GGSALES
SUM 
     DOLLARS
BY  LOWEST YearMo
BY  LOWEST CATEGORY
ON TABLE NOTOTAL
ON TABLE HOLD AS HOLD1
ON TABLE SET STYLE *
$
ENDSTYLE
END
-*IA_GRAPH_BEGIN
-*Do not delete or modify the comments below
*-INTERNAL_COMMENT LINE#0$PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8IS0tMS4wLS0+DQo8Um9vdCB2ZXJzaW9uPSIxLjAiPg0KICAgIDxPYmplY3Qgb2JqZWN0SWQ9IkNoYXJ0XzEiPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iTGlua2VkU29ydHMiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciLz4NCiAgICA8L09iamVjdD4NCiAgICA8T2JqZWN0IG9iamVjdElkPSJHTE9CQUwiPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iU2FtcGxlRGF0YSIgdHlwZT0iamF2YS5sYW5nLkJvb2xlYW4iPmZhbHNlPC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9Ikdsb2JhbFJlY29yZExpbWl0IiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj41MDA8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsUnVuUmVjb3JkTGltaXQiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPjA8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsT3B0aW1pemF0aW9uIiB0eXBlPSJqYXZhLmxhbmcuQm9vbGVhbiI+dHJ1ZTwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJmaWVsZERpc3BsYXlNb2RlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5sYWJlbDwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJwcmVmaXhEaXNwbGF5TW9kZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyIvPg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iQWN0aXZlX1N0eWxlX1VzZXJfdHlwZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+cG93ZXI8L1Byb3BlcnR5Pg0KICAgICAgICA8UHJvcGVydHkgbmFtZT0iR2xvYmFsVmFsdWVzUGFnaW5nIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj40PC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9IkZvY2V4ZWNQcmVmZXJlbmNlcyIgdHlwZT0iTWFwIj4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImF1dG9EcmlsbFNjcmlwdCIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyIvPg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUVkaXRNb2RlSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5mYWxzZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5Rm9ybWF0VGFiSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj50cnVlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlIb21lVGFiSW5mb01pbmlQcmVmZXJlbmNlIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5mYWxzZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5UXVpY2tBY2Nlc3NUb29sYmFyU2F2ZUluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+dHJ1ZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJtZXRhZGF0YV92aWV3cyIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+TWV0YURhdGFUcmVlLlZJRVdfRElNUzwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkaXNwbGF5UmVzb3VyY2VzRmllbGRUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlJbnNlcnRUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTbGljZXJzVGFiRWRpdEluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0icnVuT25TdGFydHVwRGVmZXJyZWRJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTZXJpZXNUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImluZm9Bc3Npc3RNb2RlQWxsb3dlZEluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGVmYXVsdF9wcmV2aWV3X3BhZ2VsaW1pdF9sYXlvdXQiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPjE8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGVmYXVsdF9wcmV2aWV3X3BhZ2VsaW1pdCIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+NTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJkZWZhdWx0X2NvbXBvc2VfZm9ybWF0IiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5QREY8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUludGVyYWN0aXZlTW9kZUluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+dHJ1ZTwvRW50cnk+DQogICAgICAgICAgICA8RW50cnkga2V5PSJydW5PblN0YXJ0dXBJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPnRydWU8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheURhdGFUYWJJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPmZhbHNlPC9FbnRyeT4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9ImRpc3BsYXlTbGljZXJzVGFiSW50ZXJhY3RpdmVJbmZvTWluaVByZWZlcmVuY2UiIHR5cGU9ImphdmEubGFuZy5TdHJpbmciPnRydWU8L0VudHJ5Pg0KICAgICAgICAgICAgPEVudHJ5IGtleT0iZGlzcGxheUxheW91dFRhYkluZm9NaW5pUHJlZmVyZW5jZSIgdHlwZT0iamF2YS5sYW5nLlN0cmluZyI+ZmFsc2U8L0VudHJ5Pg0KICAgICAgICA8L1Byb3BlcnR5Pg0KICAg
*-INTERNAL_COMMENT LINE#1$ICAgICA8UHJvcGVydHkgbmFtZT0iY2FzY2FkZU5hbWVzIiB0eXBlPSJNYXAiLz4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9Ik1hc3Rlcl9GaWxlcyIgdHlwZT0iU2V0Ij4NCiAgICAgICAgICAgIDxFbnRyeSB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5IT0xEMTwvRW50cnk+DQogICAgICAgIDwvUHJvcGVydHk+DQogICAgICAgIDxQcm9wZXJ0eSBuYW1lPSJtZXRhZGF0YVZpZXdBcyIgdHlwZT0iTWFwIj4NCiAgICAgICAgICAgIDxFbnRyeSBrZXk9IkhPTEQxIiB0eXBlPSJqYXZhLmxhbmcuU3RyaW5nIj5NZXRhRGF0YVRyZWUuVklFV19MSVNUPC9FbnRyeT4NCiAgICAgICAgPC9Qcm9wZXJ0eT4NCiAgICAgICAgPFByb3BlcnR5IG5hbWU9ImVuYWJsZVByZXZpZXciIHR5cGU9ImphdmEubGFuZy5Cb29sZWFuIj50cnVlPC9Qcm9wZXJ0eT4NCiAgICA8L09iamVjdD4NCjwvUm9vdD4NCg==
-*Do not delete or modify the comments above
ENGINE INT CACHE SET ON
-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';
-DEFAULTH &WF_TITLE='WebFOCUS Report';
GRAPH FILE HOLD1
-* Created by Info Assist for Graph
SUM HOLD1.HOLD1.DOLLARS
BY HOLD1.HOLD1.CATEGORY
ACROSS HOLD1.HOLD1.YearMo
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET GRWIDTH 1
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 1
ON GRAPH SET GRXAXIS 1
ON GRAPH SET LOOKGRAPH VBRSTK1
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0); 
setCurveFitEquationDisplay(false); 
setPlace(true); 
*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
*END
*GRAPH_JS
series: [
   {series: 0, color: 'red'},
   {series: 1, color: 'yellow'},
   {series: 2, color: 'green'}  
]
*END
ENDSTYLE
END
-RUN
 
-*IA_GRAPH_FINISH


Looking through the docs on bar charts, I don't see anything available on conditional formatting for each series across time (or whatever it may be).

See here: Bar chart properties.

Maybe look into defining your conditionals within hidden COMPUTE fields and then use the flag values you get from the COMPUTEs in some WHEN stylesheet statements?

Anyone else have any ideas for conditionally styling various series?


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
June 21, 2016, 11:06 AM
Barry Solomon
Hi Reiter

Study the Chart API and JScharts, you should be able to change the style section of your report to get the desired effects. Below is an example of error bar chart that may help to provide a starting point. Good luck I am not an expert at this stuff, sorry.

*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
setDisplay(getDataText(3), true);
setDisplay(getDataText(2), true);
setDisplay(getDataText(1), true);
setDisplay(getDataText(0), true);
setScaleMax(getY1Axis(),&maxy);
setScaleMin(getY1Axis(),&miny);
setTextString(getY1Title(),"Feet");
setDataTextPosition(5);
*END
*GRAPH_JS
mouseOverIndicator: {enabled: true,color: ' '},
introAnimation: {enabled: true, duration: 1000 },
border: {width: 1, color: 'navy'},

fill: {
color: {type: 'linear',start: {x: '0%', y: '0%'},end: {x: '100%', y: '100%'},stops: [
[0, 'tan'],[1, 'ghostwhite'],],}},

yaxis: {title: {visible: true, color: 'navy'},ticks: {style: 'span'},
labels: {color: 'navy', font: 'bold 12pt '},
intervalMode: 'interval', intervalValue: &interval },
dataLabels: {visible: true,font: 'bold 12pt ', color: 'black', position: 'middle', },

legend: {visible: true, position: 'bottom'},

errorBars: {
hatWidth: '20%',
yData: [[ &BLL, &BLU ],[ &DCL ,&DCU ],[ &CHL ,&CHU ]],
line: {color: 'orangered',width: 1,dash: '2 2', errorBarAlpha: 10},
marker: {color: 'linear-gradient(0,0,100%,100%, 20% teal, 95% cyan)',shape: 'square', size: 25,} },

series: [
{series: 0, color: 'lightseagreen', tooltip: &BTIP },
{series: 1, color: 'turquoise', tooltip: &DTIP },
{series: 2, color: 'rgb(141,193,63)', tooltip: &CTIP },

]


WebFOCUS 8
Windows, All Outputs
June 21, 2016, 04:59 PM
Squatch
Be careful what you wish for, Reiter...

I modified your code to hold the JSCHART and put it into an HTMLFORM section instead. I linked in the jQuery library intending to switch the chart section colors after the page loads. But, it was not so easy.

I originally tried the jQuery "document ready" code thinking that code would execute after the HTML page loads:

$(document).ready(function() {
  // Code to change colors goes here...
});

But it turns out that the charting software injects SVG code into a frame (inside of a frameset -- not to be confused with iframes) to draw the chart. And that process goes on long after the jQuery document ready function has finished executing. So there isn't really any chart there to manipulate. Fail.

Then I tried the jQuery "window load" function. It looked promising, because it's supposed to execute after everything has loaded, including frames:

$(window).load(function() {
  // Code to change colors goes here...
});

I put it into the head section of the HTMLFORM, but it didn't work. Fail.

Then I thought that maybe if I moved it out of the head section and after the body section, maybe it would delay execution until the chart has been drawn. That worked! I put the suck in success...

But there was another problem. The chart opens up and colorizes just fine, but if the browser window is resized the original colors come back, because the chart is redrawn on a resize. Fail.

Then I tried the jQuery "resize" function, which can execute code as a browser resizes.

$(window).resize(function() {
  // Code to change colors goes here...
});

Success!

One other curiosity, though... running the code within App Studio resulted in two "frames", one for the chart and one containing text messages, which is normal. I found I needed this line to find the frame with the chart in it:

$("html body .chart svg .chartPanel rect", window.parent.frames[0].document).each(

But it didn't work when running the chart from the WebFOCUS BI Portal. The reason seems to be because there is only one frame and not two like in App Studio. So I used this line instead:

$("html body .chart svg .chartPanel rect").each(

So that made it work in the Portal.

But then I tried opening up the Portal version in App Studio, and it works just fine. Say what?!? Okay, I'm not complaining, just very confused about the quirkiness of App Studio sometimes.

One thing about colorizing this chart in sections is that it renders the legend almost useless, because the legend colors don't match the red/yellow/green coloring scheme. I suppose the original colors could be saved using jQuery/JavaScript, then brought back on a click event just outside the chart area.

Anyway, here's the code:

DEFINE FILE GGSALES
YearMo/I6YYM=DATECVT(DATE, 'I8YYMD', 'I6YYM');
END
TABLE FILE GGSALES
SUM
     DOLLARS
BY  LOWEST YearMo
BY  LOWEST CATEGORY
ON TABLE NOTOTAL
ON TABLE HOLD AS HOLD1
ON TABLE SET STYLE *
$
ENDSTYLE
END
-*IA_GRAPH_BEGIN

ENGINE INT CACHE SET ON
-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';
-DEFAULTH &WF_TITLE='WebFOCUS Report';
GRAPH FILE HOLD1
-* Created by Info Assist for Graph
SUM HOLD1.HOLD1.DOLLARS
BY HOLD1.HOLD1.CATEGORY
ACROSS HOLD1.HOLD1.YearMo
ON GRAPH HOLD AS SAVE_CHART FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET GRWIDTH 1
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 1
ON GRAPH SET GRXAXIS 1
ON GRAPH SET LOOKGRAPH VBRSTK1
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0);
setCurveFitEquationDisplay(false);
setPlace(true);
*END
-* INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
*END
ENDSTYLE
END
-RUN

-*IA_GRAPH_FINISH

-HTMLFORM BEGIN
<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/ibi_apps/jquery/js/jquery.min.js"></script>
</head>
<body>
!IBI.FIL.SAVE_CHART;
</body>
<script>
  $(window).load(function() {
	colorize_chart();
  });

  $(window).resize(function() {
	colorize_chart();
  });

  function colorize_chart() {
    // Use the following line only if you have trouble running this in App Studio:
    // $("html body .chart svg .chartPanel rect", window.parent.frames[0].document).each(

    // Otherwise, just use the next line instead, which makes it work in the WebFOCUS BI Portal:
	$("html body .chart svg .chartPanel rect").each(
	  function(index) {
	    var category = $(this).attr("tdgtitle").split(",");
		category = category[0];

		var dollars = $(this).attr("tdgtitle").split(":");
		dollars = dollars[1].replace(/,/g, "");
		dollars = parseFloat(dollars);

		switch(category.toLowerCase()) {
		  case "coffee": if (dollars < 720000) $(this).attr("fill", "rgb(255, 0, 0)");
			             if (dollars >= 720000 && dollars <= 750000) $(this).attr("fill", "rgb(255, 255, 0)");
		                 if (dollars > 750000) $(this).attr("fill", "rgb(0, 255, 0)");
			             break;
		   case "food":	 if (dollars < 700000) $(this).attr("fill", "rgb(255, 0, 0)");
			             if (dollars >= 700000 && dollars <= 720000) $(this).attr("fill", "rgb(255, 255, 0)");
			             if (dollars > 720000) $(this).attr("fill", "rgb(0, 255, 0)");
			             break;
		  case "gifts":	 if (dollars < 400000) $(this).attr("fill", "rgb(255, 0, 0)");
			             if (dollars >= 400000 && dollars <= 500000) $(this).attr("fill", "rgb(255, 255, 0)");
			             if (dollars > 500000) $(this).attr("fill", "rgb(0, 255, 0)");
			             break;
		  }
    });
  }
</script>
</html>
-HTMLFORM END



App Studio
WebFOCUS 8.1.05M
Windows, All Outputs
June 21, 2016, 05:22 PM
Francis Mariani
Holy Mackerel Squatch!

I wonder if all this would be a lot easier using Highcharts...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
June 24, 2016, 08:36 AM
jcannavo
quote:
Holy Mackerel Squatch!


I second that! Squatch going above and beyond on that one.

Reiter - If you're curious about Highcharts here's a link to something David Briars posted a while back: http://forums.informationbuild...987098626#9987098626


JC
WebFOCUS Dev Studio / App Studio
8.2.01
Windows 7