[javascript+cloudpebble] json array string replace variable

[donderdraak]

Ik ben op Cloudpebble in javascript een simpele app aan het maken dat alleen de windrichting aangeeft op een vaste locatie. Het is voor mezelf/hobby bedoeld. Heel misschien dat ik later functies uitbreid met een plaatje van de windrichting of temperatuur.

Op internet vond ik veel voorbeelden van hoe je een ajax json array aanroept maar bij mijn script werkt het niet. In de console.log zie ik dat er backslashes "\" in de array staan. Ik heb een string replace erin gezet maar ik vermoed niet op de juiste plek want in de console.log zie ik na een nieuwe build dezelfde backslashes. Inmiddels zijn die backslashes opgelost want ik heb "&callback=?" uit de url verwijderd.

Hoe krijg ik de array werkend en hoe kan ik de variabel voor windrichting filteren?
Hoe schrijf je die variable weg zodat ik die als text kan laten weergeven als "card.description"?

Topics die ik heb gebruikt voor inspiratie
https://developer.pebble....pebble-js-tutorial/part1/
http://www.sitepoint.com/ajaxjquery-getjson-simple-example/
http://www.w3schools.com/...asp?filename=tryjson_http
http://www.w3schools.com/json/json_http.asp
http://codereview.stackex...data-from-json-in-a-table

Ajax code uit project 1:

code:

ajax({
  type: 'GET',
  url: 'http://weerlive.nl/api/json-10min.php?locatie=utrecht',
  dataType: 'json',
  success: function (data) {
    console.log("Successfully fetched weather data!");
    var windr = data.liveweer[0].windr;
    var location = data.liveweer[0].plaats;
    var temperature = data.liveweer[0].temp;
    card.subtitle(location + ", " + temperature);
    card.body(windr);
  }
});
card.show();

Members only:

Alleen zichtbaar voor ingelogde gebruikers. Inloggen

[ Voor 17% gewijzigd door donderdraak op 29-03-2016 08:02 ]

[orf]

De API die je gebruikt is een jsonp API. Dat betekent dat je een jsonp request moet doen of gewoon zelf de url als script-tag gebruikt. Zoiets:

JavaScript:

var src = 'http://weerlive.nl/api/json-10min.php?locatie=utrecht&callback=parseJSON'; 
var s = document.createElement('script'); 
s.setAttribute('src', src); 
document.body.appendChild(s);

function parseJSON(json){
  var data = JSON.parse(json);
  console.log(data);
  console.log(data.liveweer[0].windr);
}

In de URL geef je mee welke functie aangeroepen moet worden, die functie staat in je eigen script. Met jQuery kun je dat ook nog op andere manieren schrijven, maar de basis is ongeveer hetzelfde.

[ Voor 3% gewijzigd door orf op 28-03-2016 23:06 ]

[Pizzalucht]

Wat @orf zegt is gedeeltelijk waar, je hoeft niet perse een callback mee te geven. Daarbij regelt jQuery zelf de jsonp callbacks in ajax calls.
Als je de feed in je script wilt gebruiken hoef je alleen maar de URL aan te passen naar: http://weerlive.nl/api/json-10min.php?locatie=utrecht

De volgende code werkt gewoon bij mij:

code:

$.ajax({
  type: 'GET',
  url: "http://weerlive.nl/api/json-10min.php?locatie=utrecht",
  dataType: 'json',
  success: function (data) {
    var windrichting = data.liveweer[0].windr;
    console.log(windrichting);
  }
});

[ Voor 44% gewijzigd door Pizzalucht op 28-03-2016 23:32 ]

[donderdraak]

bedankt, weer een stapje verder na jullie suggesties zie ik in de log geen json foutmelding voorbij komen.
Helaas lukt het nog niet om de variabelen te parsen naar het scherm.

Het is me toch gelukt doordat ik een nieuw project gemaakt en wat kleine aanpassingen.

code:

ajax(
  {
    url: URL,
    type: 'json'
  },
  function(data) {
    // Success!
    console.log("Successfully fetched weather data!");

    // Extract data
    var location = data.liveweer[0].plaats;
    var temperature = data.liveweer[0].temp + "C";
    var wind = data.liveweer[0].windr;
    var description = data.liveweer[0].samenv;
    
    // Show to user
    card.subtitle(location + ", " + temperature + ", " + wind);
    card.body(description);
  },
  function(error) {
    // Failure!
    console.log('Failed fetching weather data: ' + error);
  }
);

[ Voor 72% gewijzigd door donderdraak op 29-03-2016 07:55 ]