Skip to main content
Version: 5.x
Supported on
Snapchat
Camera Kit Android
This feature may have limited compatibility and may not perform optimally.
Camera Kit iOS
This feature may have limited compatibility and may not perform optimally.
Camera Kit Web
This feature may have limited compatibility and may not perform optimally.

AccuWeather API Example

The Weather API - AccuWeather demonstrates how to use a Remote Service Module to get weather conditions and forecasts for locations around the world using the AccuWeather API. This guide will show you how to use the API to get current weather conditions, as well as hourly and daily forecasts and display them in your lenses. Locations are input to the API as coordinates.

The AccuWeather API Module is available separately in APIs category of Lens Studio Asset Library. You can read about all the functionality available in the AccuWeather API here.

Weather API - AccuWeather Asset

Import from Asset Library

You can find the Weather API - AccuWeather asset in the Lens Studio Asset Library and import it into your project. Click here to learn more about using assets from the Asset Library. Once imported, locate the Weather API - AccuWeather prefab in the Asset Browser. Drag and drop it under an Orthographic Camera in the Scene panel. If you don't have an Orthographic Camera, add one by clicking the "+" button in the Scene panel and searching for "Orthographic Camera." To edit the asset's contents, right-click the prefab in the Asset Browser and select Unpack for Editing. Click here to learn more about Asset Packages.

To respect user privacy you cannot currently get access to the users location while using the remote service module. You can read more about these restrictions here.

Example Walkthrough

The Weather API - AccuWeather asset includes three examples:

The first two examples both use Weather - Single Day [EDIT ME] prefab which can be customized with new icons or fonts.

Multiple Day Forecast

The multiple day forecast example uses the Weather - Single Day prefab to display 5 days of weather forecast.

multi day example

The MultipleDayForecastController script is used to populate each Weather - Single Day prefab with the corresponding data.

multi day example

Inputs

  • AccuWeather API: The AccuWeatherAPI script to use the API.
  • City: The city name to use for the forecast. You can view or add cities by their coordinates in ExampleCities.js.
  • UI Weather Days: The input UIWeatherDay for each day of the forecast. Each Weather - Single Day prefab has a UIWeatherDay script to display weather information.
  • Loading Object: An optional object to enable/disable based on whether the API request is loading.
  • Loading Time: How long to delay before showing the loading UI.

Current Condition

The current condition example uses the Weather - Single Day prefab to display a single day of weather conditions.

current condition example

The CurrentConditionController script is used to populate each Weather - Single Day prefab with the corresponding data.

current condition script

Inputs

  • AccuWeather API: The AccuWeatherAPI script to use the API.
  • City: The city name to use for the forecast. You can view or add cities by their coordinates in ExampleCities.js.
  • UI Weather Day: The input UIWeatherDay to use to display the weather.
  • Loading Object: An optional object to enable/disable based on whether the API request is loading.
  • Loading Time: How long to delay before showing the loading UI.

The print hourly forecast example calls the hourly forecast endpoint of the AccuWeather API and prints the forecasted conditions.

hourly forecast script

Inputs

  • AccuWeather API: The AccuWeatherAPI script to use the API.
  • City: The city name to use for the forecast. You can view or add cities by their coordinates in ExampleCities.js.

Adding a custom city

In order to add a custom city for use as inputs to the various examples simply add the city name and its coordinates to ExampleCities.js.

add custom city

Previewing Your Lens

You’re now ready to preview your Lens! To preview your Lens in Snapchat, follow the Pairing to Snapchat guide.

Was this page helpful?
Yes
No