[SOLVED] Change colors in HTML5 chart extension

September 08, 2020, 08:38 PM

Is there a way to change the Red and green colors on this chart. It is a chart extention.

  

ENGINE INT CACHE SET ON
SET PAGE-NUM = NOPAGE
SET SQUEEZE = OFF
SET DROPBLNKLINE = ALL
-DEFAULTH &WF_HTMLENCODE=OFF;
SET HTMLENCODE=&WF_HTMLENCODE
SET HTMLCSS=ON
-DEFAULTH &WF_EMPTYREPORT=ON;
SET EMPTYREPORT=&WF_EMPTYREPORT

SET EMBEDHEADING=ON
SET GRAPHDEFAULT=OFF
-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';


DEFINE FILE CAR
  LOTSOFDATA/A200V =  'Model: ' || MODEL || '<br>BodyType: ' || BODYTYPE || '<br>Dealer Cost: ' || FTOA(DEALER_COST, '(D12M)', 'A25V')  || '<br>Retail Cost: ' || FTOA(RETAIL_COST, '(D12M)', 'A25V') || '<br>Sales: ' || FTOA(SALES, '(D12M)', 'A25V') ;
  COST/D10 =  ;

END

GRAPH FILE CAR
SUM

COST
COST
BY COUNTRY
BY LOTSOFDATA
BY CAR
-*ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH HOLD AS MYCHART FORMAT JSCHART
ON GRAPH SET VZERO 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 LOOKGRAPH EXTENSION
ON GRAPH SET AUTOFIT ON
ON GRAPH SET CSSURL 'sis_analytics2/common/chartColors.css'
ON GRAPH SET STYLE *
*GRAPH_SCRIPT

setPieDepth(0);
setPieTilt(0);
setDepthRadius(0);
setCurveFitEquationDisplay(false);
setPlace(true);

*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/Flat.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, ORIENTATION=LANDSCAPE, $
TYPE=REPORT, CLASS=chartColors, $
TYPE=DATA, COLUMN=N1, BUCKET= >levels, $
TYPE=DATA, COLUMN=N2, BUCKET= >levels, $
TYPE=DATA, COLUMN=N3, BUCKET= >levels, $
TYPE=DATA, COLUMN=N4, BUCKET= >total, $
TYPE=DATA, COLUMN=N5, BUCKET= >fail, $
*GRAPH_SCRIPT

setReportParsingErrors(false);
setSelectionEnableMove(false);
*GRAPH_JS_FINAL
"pieProperties": {
    "holeSize": "0%"
},
"chartType": "com.ibi.dendrorag",
"agnosticSettings": {
    "chartTypeFullName": "com.ibi.dendrorag"
},
"extensions": {
	"com.ibi.dendrorag": {
        "RootName": "CNTTERMNAME" ,
		"indRed": 50,
        "indAmber": 70,
		"valsInNode": false,
		"abbrValues": false},
"styles" : {
    "html": {
        "td": [
            "vertical-align: bottom;",
        ],
    }
}
}
*END
ENDSTYLE
END



-RUN
-HTMLFORM BEGIN
<html>
<head>
<title>Danny-SRL example</title>
<script src="/ibi_apps/ibi_html/javaassist/jquery/jquery_min.js"></script>



</head>
<body>
<div >
!IBI.FIL.MYCHART;
</div>
</body>
</html>
-HTMLFORM END

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

September 15, 2020, 03:11 PM

Tony A

The reason that members post code examples is to show what they are trying to achieve or what output they are trying to manipulate. Here, Getit is trying to change the output from the DendroRAG HTML chart extension. Your example is using the inbuilt pie chart - not equitable.

Posting an example using a completely different output doesn't help at all - although I applaud you for trying to help

quote:
"extensions": {
"com.ibi.dendrorag": {
"RootName": "CNTTERMNAME" ,
"indRed": 50,
"indAmber": 70,
"valsInNode": false,
"abbrValues": false}

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