Show the Local Weather app Skycons issue


Show the Local Weather. Can’t get the icons to appear. I’m sure I missed some little thing (it’s always that way) but I’ve been stuck for a while. Please help. Link to my pen:


You have a lot of code inside of a skycons() function that never gets called. The code seems to try and display every type of icon possible in several different elements that you have not created yet.

When using the Dark Sky Weather API, there are only 3 steps needed to show a Skycon:

  1. Create a <canvas> element in your HTML with a width, height, and ID:
<canvas width="64" height="64" id="icon"></canvas>

  1. Create a Skycons object with your desired preferences:
// on Android, a nasty hack is needed: {"resizeClear": true}
var skycons = new Skycons({"color": "pink", "resizeClear": true});

  1. Add the Skycon to your <canvas> element using the icon code provided by the Dark Sky API JSON at data.currently.icon:
skycons.add(document.getElementById("icon"), data.currently.icon);

Optionally, if you want to animate your Skycon, a 4th step is to call;. All together, it looks like this:

var skycons = new Skycons({"color": "pink", "resizeClear": true});
skycons.add(document.getElementById("icon"), data.currently.icon);;


Huge thanks! Your explanation is perfect!