July 6

WeatherBlox: Flexible Weather Views

We recently released WeatherBlox, an exciting new service that allows you to quickly add highly-customizable weather content to your web applications and sites.

WeatherBlox is a library of weather views for the web that can be used individually for small sections of specific weather content or combined into larger layouts for full-page weather content custom to your application’s unique requirements. These views are fully responsive as well, meaning they are really flexible to ensure they fit within any context they’re added into. And since they’re designed for the web, customizing the design of your WeatherBlox views is painless by overriding and extending the library’s base CSS style declarations.

For example, you can display the current conditions for any location by using the available Observations view:

WeatherBlox Observations

Individual views can also be fully-functional interactive components. For instance, you can use MapViewer to display a local or regional weather map with the ability to toggle between weather data layers:

WeatherBlox MapViewer

Two types of usage are supported for working with the views — frontend using JavaScript, or backend using the WeatherBlox API. Using the JavaScript method is the easiest and quickest method for integrating views into your site or application as a small code snippet is all that is needed.

Using the JavaScript method, you can get a complete 7-day forecast into your own web site or application with a minimal amount of code:

// Configure Aeris API access keys
Aeris.wxblox.setAccess('CLIENT_ID', 'CLIENT_SECRET');

// Set widget variable
var localForecast = new Aeris.wxblox.views.Forecast('#local-forecast');

// Set API request parameters to be used when requesting data
var params = { 
     p: '98109',
     limit: 5
};

// Load and render the view
localForecast.load(params);

// Configure Aeris API access keys

Aeris.wxblox.setAccess('CLIENT_ID', 'CLIENT_SECRET');

// Set widget variable

var localForecast = new Aeris.wxblox.views.Forecast('#local-forecast');

// Set API request parameters to be used when requesting data

var params = {

p: '98109',

limit: 5

};

// Load and render the view

localForecast.load(params);

However, using the WeatherBlox API and backend implementation, you are given more control over caching the views and content which can greatly reduce the views’ API usage against your account’s access limits. We even provide you with a PHP package to make it even easier to work with our view API.

Similar to the above JavaScript example, below is the equivalent version using the WeatherBlox API:

<?php
Aeris\WxBlox\Config::getInstance()->setAccess(‘CLIENT_ID’, 'CLIENT_SECRET');

$opts = array('limit' => 5);
$view = new Aeris\WxBlox\Component('forecasts/detailed', '98109', $opts);
...
?>
<div class="local-forecast"><?php echo $view->html(); ?></div>

<?php

Aeris\WxBlox\Config::getInstance()->setAccess(‘CLIENT_ID’, 'CLIENT_SECRET');

$opts = array('limit' => 5);

$view = new Aeris\WxBlox\Component('forecasts/detailed', '98109', $opts);

...

Getting Started with WeatherBlox

Get started using Aeris WeatherBlox by ensuring you have an active Aeris API account. Make sure to also review the documentation on requesting views and API usage.

Post Details

Posted by Nick Shipes at 11:25 am

WeatherBlox: Flexible Weather Views

Getting Started with WeatherBlox

No comments yet.

Leave a Reply Cancel reply