Focal Point
[CASE-OPENED] HTML5 Chart - Scatter Chart - By Region/Product Across Date.

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

April 05, 2016, 03:27 PM
David Briars
[CASE-OPENED] HTML5 Chart - Scatter Chart - By Region/Product Across Date.
My dataset looks like this:

 Region       Product                 Date  Dollar Sales  MARKER_COLOR         
 ------       -------                 ----  ------------  ------------         
 Midwest      Latte             1996/01/01         87923  RED         
                                1996/02/01        107260  GREEN       
                                1996/03/01        113627  GREEN       
              Mug               1996/01/01         49594  RED         
                                1996/02/01         54461  RED         
                                1996/03/01         43169  RED         
              Scone             1996/01/01         75861  RED         
                                1996/02/01         38734  RED         
                                1996/03/01         82879  RED         
 Northeast    Latte             1996/01/01        123990  GREEN       
                                1996/02/01        167443  GREEN       
                                1996/03/01        155399  GREEN       
              Mug               1996/01/01         46213  RED         
                                1996/02/01         49858  RED         
                                1996/03/01         66458  RED         
              Scone             1996/01/01         35452  RED         
                                1996/02/01         17600  RED         
                                1996/03/01         31140  RED 


I am looking for a data visualization - HTML5 Chart - that has the following attributes:
* Vertical (y) axis should be Region and then Product.
* Horizontal (x) axis should be Date.
* Chart Type should be a 'scatter' where each point represents the intersection of a Region/Product and date.
* Each point (marker) should be colored, red or green, depending upon the value of MARKER_COLOR.

Here is the extract used to create the dataset:
  
TABLE FILE GGSALES
SUM DOLLARS
COMPUTE 
    MARKER_COLOR/A12 = IF DOLLARS LT 100000 THEN 'RED' ELSE 'GREEN';
BY  REGION
BY  PRODUCT
BY  DATE
IF  DATE LE 19960331
IF  REGION EQ 'Midwest' OR 'Northeast'
IF  PRODUCT EQ 'Latte' OR 'Mug' OR 'Scone'
ON TABLE SET STYLEMODE FIXED
END
-EXIT 


I've tried creating the graph with InfoAssist (running under WFDS) and coding the GRAPH FILE command in the text editor, with neither
set of attempts yielding anything close to what I need.

My searches & review of the docs, find very few examples of this type of scatter chart.

Any assistance gratefully received.

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




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster
April 05, 2016, 09:05 PM
David Briars
Here is a schematic of what my graph needs to look like:

I realize this schematic might imply that this is a tabular report, but my requirement is for a HTML5 JSCHART, as my x-axis is really daily data, and hence I need responsiveness, and need to avoid the column number limitations in a tabular report...also in HTML5 visualizations the dates will display according to 'best fit'....




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster
April 09, 2016, 11:05 PM
dbeagan
As far as I can tell, the spectral chart comes closest to what you want:
-DEFAULTH &WF_STYLE_UNITS ='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='400';
-DEFAULTH &WF_STYLE_WIDTH ='700';
 ENGINE INT CACHE SET ON
 DEFINE FILE ibisamp/ggsales
  REG_PROD/A50 = REGION|' / '|PRODUCT;
 END
 GRAPH FILE ibisamp/ggsales
 SUM 
 COMPUTE COLOR/I9 = IF DOLLARS LT 50000 THEN 0 ELSE 1;
  ACROSS DATE     AS ''
      BY REG_PROD AS ''
 WHERE DATE LE 19970331
 WHERE REGION EQ 'Midwest' OR 'Northeast'
 WHERE PRODUCT EQ 'Latte' OR 'Mug' OR 'Scone'
 ON GRAPH PCHOLD FORMAT JSCHART
 ON GRAPH SET LOOKGRAPH SPECTRAL
 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 GRWIDTH 5
 ON GRAPH SET GRXAXIS 2
 ON GRAPH SET AUTOFIT ON
 ON GRAPH SET STYLE *
 PAGECOLOR=RGB(212 247 255),$
 *GRAPH_SCRIPT
 setDisplay(getLegendArea(),false);
 setFillColor(getChartBackground(),new Color(212,247,255));
 setBorderColor(getChartBackground(),new Color(212,247,255));
 ENDSTYLE
 END



WebFOCUS 8.2.06
April 11, 2016, 12:36 PM
David Briars
Thank you dbeagan!

Yes, a spectral will 'tell the story' I am looking for - 'valuations' across time, by category.

Thank you.

Thank you also for the code sample, showing how to set up the verb object and sort fields for the LOOKGRAPH SPECTRAL.

The code sample, and my application of it to my real situation looks great.

One thing I need help with...

'Series Labels', (in the sample: 'Midwest / Latte', 'Northeast / Mug', mine are larger), will not display, unless the chart is very wide at initial display time.

Any ideas on how to make the 'Series Labels', categories on the 'y axis' display always?




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster
July 19, 2016, 11:38 AM
David Briars
quote:
...One thing I need help with...'Series Labels', (in the sample: 'Midwest / Latte', 'Northeast / Mug', mine are larger), will not display, unless the chart is very wide at initial display time...

We have 8105M in a sandbox for initial testing. (Planning to upgrade from 8007.)

When running this code sample of a spectral graph, in 8105M, the y and x axis labels display much more cleanly/responsively, as compared to 8007.

This message has been edited. Last edited by: David Briars,




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster