how to update a bitmap after background event?

Hi,

I've only started using ConnectIQ for a few days so apologies if I've missed anything. I would like to update a bitmap after a background event has run.  I based my background event on this code as well as some other examples I found online. This is my Background.mc file:

using Toybox.Background;
using Toybox.System as Sys;
using Toybox.Communications as Comm;

(:background)
class BgbgServiceDelegate extends Toybox.System.ServiceDelegate {
	
	var APIKEY = "my key";
	var lat = 38.8551;
	var lon = -94.8001;
	
	function initialize() {
		Sys.ServiceDelegate.initialize();
		inBackground = true;
	}
	
    function onTemporalEvent() {
	    	var UNITS = (Sys.getDeviceSettings().temperatureUnits==Sys.UNIT_STATUTE) ? "imperial" : "metric";
			var url = "https://api.openweathermap.org/data/2.5/weather";
	    	var param = {
	    		"lat" => lat.toFloat(),
	    		"lon" => lon.toFloat(),
	    		"appid" =>APIKEY,
	    		"units" => UNITS};
			var options = {
				:methods => Comm.HTTP_REQUEST_METHOD_GET,
				:headers => {"Content-Type" => Communications.REQUEST_CONTENT_TYPE_URL_ENCODED},
				:responseType => Comm.HTTP_RESPONSE_CONTENT_TYPE_JSON
			};
   	
			Comm.makeWebRequest(
	    	   	url,
	    	   	param,
	    	   	options,
	    	   	method(:receiveWeather));
    }
    
    function receiveWeather(responseCode,data) {
    	var ret = (responseCode == 200) ? data :responseCode;
    	
		Background.exit(ret);
	}
}

Then, in the onBackgroundData() function of the App.mc class, I get my variables like so (I'm aware I haven't yet checked if they are null from an error code):

...

function onBackgroundData(data) {

    	var weather = data.get("weather")[0].get("icon");
    	var temperature = data.get("main").get("temp");
    	var weatherCodeValue = weatherCodes.get(weather);

        App.getApp().setProperty("weatherCode", weatherCodeValue);
        App.getApp().setProperty("temperature", temperature);
        Ui.requestUpdate();
    }    

And I assume I can obtain these variables using the App.getApp().getProperty() function. Based on a post in the same thread I linked earlier, it seems the initialize() function runs each time a background event has run, so what I did was put this code there:

class TestView extends Ui.WatchFace {

// based on the value of weatherCode
var icons = {
	          "Snow" => Rez.Drawables.hud_snow,
	          "Sun"  => Rez.Drawables.hud_sunny,
	          "Few Clouds" => Rez.Drawables.hud_partlycloudy,
	          ...
	        }; 
	        
... }

    function initialize() {
        WatchFace.initialize();
        
        temperature = App.getApp().getProperty("temperature");
    	weatherCode = App.getApp().getProperty("weatherCode");
    
  		if (!weatherCode.equals(null))
  		{
  			weatherHUD = null; 
  			weatherHUD = Ui.loadResource(icons.get(weatherCode));
  			Ui.requestUpdate();
  		}
  		
...

function onUpdate(dc as Dc) as Void {

... 
if (!weatherCode.equals(null)) { dc.drawBitmap(x_pos, y_pos, weatherHUD); }

...

if (!temperature.equals(null)) {
       		dc.drawText(x, y, Gfx.FONT_XTINY, Lang.format("$1$" + StringUtil.utf8ArrayToString([0xC2,0xB0]), [temperature.format("%d")]), Gfx.TEXT_JUSTIFY_LEFT);
        }
     
...

However, I don't believe this is the correct approach, as my app sometimes crashes when I simulate a background event with the simulator. What is the proper (and efficient) approach to do this?

Thanks.