// silveracorn.nz MXUI website --- Version MX_2.2.5 - 7-Sep-2022
Some info on how to customise the jpgraphs

jpgraphs are used for the first block on the MX UI Multilingual website index page.
and
for pop-up graphs for Gauges.

In CumulusMX Cumulus.ini file there is a section
[Graphs]
which now includes switches controlling the output of data for the charts page and for jpgraphs.
Any graph which is to be displayed must be set to Visible=1
(CumulusMX will need to be restarted to recognise a changed setting)

AppTempVisible=1
DPVisible=1
FeelsLikeVisible=1
HIVisible=1
HumidexVisible=1
InHumVisible=1
InTempVisible=1
OutHumVisible=1
TempVisible=1
UVVisible=1
WCVisible=1
SolarVisible=1

note:-
DP = Dew Point,
HI = Heat Index
WC = Wind Chill


The jpgraph folder contains all the core files that make the jpgraphs work.
There is nothing to edit in this folder
NOTE:-
	Despite there being a 'lang' sub folder, there is no translation available for jpgraphs.

In the main folder there are the following files:-
graphconfig.json - updated by CumulusMX
graphsettings.php - a 'static' file which should not be modified.
and a set of files graphxxxxx.php - one for each available graph.
We will use the most complex graph - graphTempHumFL.php to explain how to customise the a graph.

graphTempHumFL.php
<?php
// silveracorn.nz MXUI website - Version MX_2.1.1 - 21-Aug-2020
// MX version 3086
/*!
 * Simple static trend graphs for Cumulus MX
 *
 * Created by Mark Crossley, January 2015
 *
 * Released under GNU GENERAL PUBLIC LICENSE, Version 2, June 1991
 * See the enclosed License file
 *
 * File encoding = UTF-8
 *
 */

require_once './graphSettings.php';

$name = basename($_SERVER['PHP_SELF'], '.php').'.png';

// Create the graph and set a scale.
$graph = new Graph($GRAPH['width'], $GRAPH['height'], $name, $GRAPH['cachetime']);
$graph->SetScale('datlin');

//fetch the data
$data = get_data('temp');
$data2 = get_data('hum');

graph_common($graph);

$graph->title->Set('Temperature (°' . $data['units']. ') and Humidity (RH%)');

// Setup margin and titles
//               Lft,rgt,top,bot
$graph->SetMargin(55, 60, 20, 53); // both margins increased from 50 to 53 as reversed labels increase in vertical size
// set up the scales for all axes
$graph->xaxis->scale->setAutoMin(0);
$graph->yaxis->scale->SetGrace(5, 0);
$graph->yaxis->SetLabelFormatString("%02.1f");
$graph->yaxis->title->Set('Temperature and Dewpoint');
$graph->yaxis->SetTitleMargin(32);

$graph->SetY2scale('lin');
$graph->y2axis->SetLabelFormatString("%02.1f");
$graph->y2axis->title->Set('Humidity');
$graph->y2axis->title->SetColor('black:1.0');
$graph->y2axis->SetTitleMargin(45);

// Create the linear plot
$lineplot1 = new LinePlot($data['wchill'], $data['time']);
$lineplot1->SetWeight(2);
$lineplot1->SetLegend('Wind Chill');

$lineplot2 = new LinePlot($data['dew'], $data['time']);
$lineplot2->SetWeight(2);
$lineplot2->SetLegend('Dewpoint');

$lineplot3 = new LinePlot($data['apptemp'], $data['time']);
$lineplot3->SetWeight(2);
$lineplot3->SetLegend('Apparent');

$lineplot4 = new LinePlot($data['temp'], $data['time']);
$lineplot4->SetWeight(2);
$lineplot4->SetLegend('Temperature');

$lineplot5 = new LinePlot($data2['hum'], $data['time']);
$lineplot5->SetWeight(2);
$lineplot5->SetLegend('Humidity');

$lineplot6 = new LinePlot($data['feelslike'], $data['time']);
$lineplot6->SetWeight(2);
$lineplot6->SetLegend('FeelsLike');

$line = new PlotLine(HORIZONTAL,0,"blue@0.5",2);
$graph->AddLine($line);
$graph->setClipping(true);

// Add the plots to the graph
$graph->Add($lineplot1);
$graph->Add($lineplot3);
$graph->Add($lineplot6);
$graph->Add($lineplot2);
$graph->Add($lineplot4);

$graph->AddY2($lineplot5);
//$graph->SetY2OrderBack(true); // removed as interferes with reverse set true in jpgraph/jpgraph_legend.inc.php

$lineplot1->SetColor("lightblue");	//	windchill
$lineplot2->SetColor("darkgreen");	//	dew Point
$lineplot3->SetColor("gold");			//	apparent temp
$lineplot4->SetColor("#ff1a1a");		//	red temperature
$lineplot5->SetColor("orange");		//	humidity
$lineplot6->SetColor("aqua");			//	feelslike

//$graph->legend->Reverse();
// Display the graph
@unlink(CACHE_DIR . $name);
$graph->Stroke();
?>

If you wish to remove some of the traces in the temp/dew/hum graph,
	you can edit the graphTempHumFL.php file.
!! Make a backup copy of this file !!
If you wish to remove Humidity then there are specific steps to take as
	this is on the Y2 secondary scale which appears on the right hand side of the graph.
	rem out line 26, // $data2 = get_data('hum');
	on line 30, edit the title
		$graph->title->Set('Temperature (°' . $data['units']. ') and Humidity (RH%)');
	to
		$graph->title->Set('Temperature (°' . $data['units']. ')');

	rem out the lines 42 to 46


To remove other traces on the primary scale:-
e.g. To remove wind chill,
rem out lines 49 to 51,
78
and
87
Note - these all reference $lineplot1

For other values follow the same pattern.
Edit the title if required, and rem out all lines relating to the specific numbered $lineplot to be removed.

On the index page, the set of graphs in the first block of the first row of blocks
	is controlled by the file ./indxblk_hscharts.php

	If you wish to replace one of the graphs with another, then edit the graph name and title
	e.g. Change lines 21 and 22
from
					<a href="./graphTempHumFL.php?nocache=<?php echo rand() ?>" class="highslide" onclick="return hs.expand(this)">
					<img src="./graphTempHumFL.php?nocache=<?php echo rand() ?>" alt="Temperature" title="Temperature - Click to enlarge" width="139" height="80" /></a>
to
					<a href="./graphTempOut.php?nocache=<?php echo rand() ?>" class="highslide" onclick="return hs.expand(this)">
					<img src="./graphTempOut.php?nocache=<?php echo rand() ?>" alt="Outside Temp" title="Outside Temp - Click to enlarge" width="139" height="80" /></a>

EOF