How to display different color depending on temperature?

Question

I am receiving data from an XML with info about the weather from some locations. I am fetching info about the temperature, which I want to display like this:

If the temperature is above 13, the numbers shall be displayed in red

If the temperature is between or equal to 0 and 12, the numbers shall be displayed in white

If the temperature is lower than 0, the numbers shall be displayed in blue

I have currently tried this:

 if ($result[0]['temperature'] > 13){
    $temperature = "<span style='color:#FD1B1C;'>". $result[0]['temperature']. "°"."</span>";
  }
  if ($result[0]['temperature'] >=0 && $result[0]['temperature'] <=12){
    $temperature = "<span style='color:white;'>". $result[0]['temperature']. "°"."</span>";
  }
  if ($result[0]['temperature'] < 0){
    $temperature = "<span style='color:blue;'>". $result[0]['temperature']. "°"."</span>";
  }

This code^ works but soon gets very long and "unclear". This $temperature is only one temperature and when I want to show 7 temperatures (one for each day in a week) and for multiple locations, I soon get very many ´$temperature n` variables and lines. Example: one temperature like I have shown is 9 lines of code. When I want to show it for 7 days and 3 locations it's 9x7*3 = 189 lines + spacing, you get the idea.

Maybe the best is to have this code in another file and just refer to it?

For info: The XML shows temperatures for each 6 hours (0-6, 6-12, 6-18, 18-24) this means I fetch $result[0],[4],[8],[12] to get for each day.

What if your temperature is 13 exactly? You could ... in your `if`s only set the color and _after_ all your `if`s use something like `$temperature = "". $result[0]['temperature']. "°"."";` — brombeer, Nov 07 '20 at 11:04

score 2 · Accepted Answer · answered Nov 09 '20 at 01:54

2

Make an array of breakpoints, and assign the color based on the breakpoint:

function getColor($temp) {
  $defaultColor = 'blue';
  $breakPoints = [
    '0' => 'white',
    '13' => 'red',
    ];
  
  $out = $defaultColor;
  foreach($breakPoints as $target => $color) {
      if ( (float)$target <= (float)$temp) {
          $out = $color;
      }
  }
  return $out;
}

Since we set up the breakpoints in ascending order, we set the default color to be the color for negative values. Then, as we iterate through the breakpoints, keep changing the color until the breakpoint is greater than the temperature being tested.

Note that putting this in a function allows it to be used throughout your script:

<?php
// do all your php stuff, including the getColor function
?>
<!-- html stuff -->

<?php foreach($result as $row): ?>
  <!-- display the row in html -->

  <div>The temperature is 
    <span style="color:<?= getColor($row['temperature']) ?>">
      <?= $row['temperature'] ?> °
    </span>
  </div>

<?php endforeach; ?>

answered Nov 09 '20 at 01:54

Tim Morton

2,614
1
15
23

This prints the whole array of temperatures. How can I choose which I want? With the `$result[0]['temperature']` I could change the `[0]` to for example [4]` when I wanted number four in the array, but `$row[0]['temperature']` don't work. – andreasv Nov 12 '20 at 13:45
The second example shows a way to iterate through the `$result` array and show all the results, assuming that each row of `$result` is itself an array with a key named `temperature`. Remember that on the first iteration through `$result`, `$row` is the same thing as saying `$result[0]`. Then on the second iteration, `$row` is the same thing as `$result[1]`. So if you only want index 4, you wouldn't iterate through the result array, you would just hard code it: `getColor( $result[4]['temperature'] )` But if you're only wanting to show one result, why put it in an array of results? – Tim Morton Nov 12 '20 at 14:18
I got it to work now, thank you. The reason it's inside an array is due to how I imported it from the XML: `$feed = simplexml_load_file($url) or die('Can not connect to server'); $result = array(); foreach ($feed->forecast->tabular->time as $content) {array_push($result, [ "from" => (string)$content['from'], "to" => (string)$content['to'], 'symbol' => (string)$content->symbol['name'], 'temperature' => (string)$content->temperature['value'], ]);}` I could probably do it in another way, but this is how I did it. I am no pro... – andreasv Nov 12 '20 at 15:44
Ah, XML. yuck... ;) – Tim Morton Nov 12 '20 at 16:36

score 0 · Answer 2 · answered Nov 07 '20 at 11:08

0

You can try creating an array with each locations containing an array with all the temperatures. When you iterate through the array you can do use the switch statement to check for each temperature result so that you don't have 100 if statements.

answered Nov 07 '20 at 11:08

manqlele

77
11

jibsteroos · Answer 3 · 2020-11-07T13:18:09.147

use an array to set the lower and upper limits for color white, and foreach() to construct the correct HTML. This way you can accommodate for any number of array entries (temperatures).

<?php
$limits = [0, 12]; // below 0 = blue, between 0 and 12 = white, above 12 = red
$result = [
    ['temperature' => -3,], ['temperature' => 9,], ['temperature' => 13,], ['temperature' => 6,],
    ['temperature' => -5,], ['temperature' => 11,], ['temperature' => 17,], ['temperature' => 4,],
];

$tempHtml = []; // store for HTML
foreach ($result as $key => $value) {
    $temp = $value['temperature'];
    $color = 'white'; // default
    if ($temp > $limits[1]) {
        $color = '#FD1B1C'; // red
    } elseif ($temp < $limits[0]) {
        $color = 'blue';
    }
    $tempHtml[] = "<span style='color:{$color}'>" . $value['temperature'] . "°" . "</span>";
}

echo '<pre>';
var_dump($tempHtml);
echo '</pre>';

Output:

array (size=8)
  0 => string '<span style='color:blue'>-3°</span>' (length=36)
  1 => string '<span style='color:white'>9°</span>' (length=36)
  2 => string '<span style='color:#FD1B1C'>13°</span>' (length=39)
  3 => string '<span style='color:white'>6°</span>' (length=36)
  4 => string '<span style='color:blue'>-5°</span>' (length=36)
  5 => string '<span style='color:white'>11°</span>' (length=37)
  6 => string '<span style='color:#FD1B1C'>17°</span>' (length=39)
  7 => string '<span style='color:white'>4°</span>' (length=36)

Note: if you need to target elements [0], [4], [8]... wrap the logic inside the foreach in a modulo condition:

foreach ($result as $key => $value) {
    if($key %4 === 0) {
      ...
    }

How to display different color depending on temperature?

3 Answers3