json twitter query, parse to html feed - javascript

i am trying to build a hastag feed for twitter,
i already have read how to create the search query, and i have this json structure...
{
"completed_in": 0.026,
"max_id": 201961894368653313,
"max_id_str": "201961894368653313",
"next_page": "?page=2&max_id=201961894368653313&q=wearetwo&lang=en&rpp=100&include_entities=1",
"page": 1,
"query": "wearetwo",
"refresh_url": "?since_id=201961894368653313&q=wearetwo&lang=en&include_entities=1",
"results": [
{
{
"created_at": "Sat, 12 May 2012 01:06:19 +0000",
"entities": {
"hashtags": [
{
"text": "wearetwo",
"indices": [
12,
21
]
}
],
"urls": [
],
"user_mentions": [
{
"screen_name": "crifor",
"name": "Cristina Forlani",
"id": 110646291,
"id_str": "110646291",
"indices": [
3,
10
]
}
],
"media": [
{
"id": 201101250740240387,
"id_str": "201101250740240387",
"indices": [
34,
54
],
"media_url": "http:\/\/p.twimg.com\/Asp0haZCQAMC-Sq.jpg",
"media_url_https": "https:\/\/p.twimg.com\/Asp0haZCQAMC-Sq.jpg",
"url": "http:\/\/t.co\/1EXkTMYq",
"display_url": "pic.twitter.com\/1EXkTMYq",
"expanded_url": "http:\/\/twitter.com\/crifor\/status\/201101250740240384\/photo\/1",
"type": "photo",
"sizes": {
"small": {
"w": 340,
"h": 455,
"resize": "fit"
},
"large": {
"w": 765,
"h": 1024,
"resize": "fit"
},
"thumb": {
"w": 150,
"h": 150,
"resize": "crop"
},
"orig": {
"w": 765,
"h": 1024,
"resize": "fit"
},
"medium": {
"w": 600,
"h": 803,
"resize": "fit"
}
}
}
]
},
"from_user": "stevoltan",
"from_user_id": 165713968,
"from_user_id_str": "165713968",
"from_user_name": "Stefano Voltan",
"geo": null,
"id": 201116057396719616,
"id_str": "201116057396719616",
"iso_language_code": "en",
"metadata": {
"result_type": "recent"
},
"profile_image_url": "http:\/\/a0.twimg.com\/profile_images\/2163464409\/crepes_normal.jpg",
"profile_image_url_https": "https:\/\/si0.twimg.com\/profile_images\/2163464409\/crepes_normal.jpg",
"source": "<a href="http:\/\/twitter.com\/#!\/download\/iphone" rel="nofollow">Twitter for iPhone<\/a>",
"text": "RT #crifor: #wearetwo belle facce http:\/\/t.co\/1EXkTMYq",
"to_user": null,
"to_user_id": 0,
"to_user_id_str": "0",
"to_user_name": null
},
I need to extract the media url and text... can someone please help me.. i'm really new to this... i'd appreciate if you could show me a working example of this..at least the function...

This documentation will show you how to get the data into a format you can work with using jQuery:
http://api.jquery.com/jQuery.getJSON/
Something like:
$.getJSON('http://search.twitter.com/search.json?q=wearetwo&lang=en&result_type=recent&rpp=100&include_entities=true', function(data) {
var media_url = data.results.media.media_url;
var text = data.text;
});

Related

Show Result routing path with Leaflet

I get route between 2 Point :
{
"routes": [
{
"overview_polyline": {
"points": "m{f~D}_ygHp#wAJs#Is#eAsBGk#Hg#"
},
"legs": [
{
"summary": "میدان انقلاب - انقلاب",
"distance": {
"value": 209.0,
"text": "۲۲۵ متر"
},
"duration": {
"value": 13.0,
"text": "کمتر از ۱ دقیقه"
},
"steps": [
{
"name": "بزرگراه اهواز-حمیدیه",
"instruction": "در جهت شرق در بزرگراه اهواز-حمیدیه قرار بگیرید",
"bearing_after": 119,
"type": "depart",
"distance": {
"value": 25.0,
"text": "۲۵ متر"
},
"duration": {
"value": 1.0,
"text": "کمتر از ۱ دقیقه"
},
"polyline": "m{f~D}_ygHTm#",
"start_location": [
48.629912,
31.333827
]
},
{
"name": "انقلاب",
"instruction": "در میدان انقلاب، از خروجی دوم، خارج شوید",
"rotaryName": "میدان انقلاب",
"bearing_after": 126,
"type": "rotary",
"modifier": "straight",
"exit": 2,
"distance": {
"value": 101.0,
"text": "۱۲۵ متر"
},
"duration": {
"value": 5.0,
"text": "کمتر از ۱ دقیقه"
},
"polyline": "wzf~DkaygHNWJQJs#Is#Yk#",
"start_location": [
48.630143,
31.333717
]
},
{
"name": "",
"instruction": "به مسیر خود ادامه دهید",
"bearing_after": 53,
"type": "exit rotary",
"modifier": "straight",
"exit": 2,
"distance": {
"value": 83.0,
"text": "۱۰۰ متر"
},
"duration": {
"value": 8.0,
"text": "کمتر از ۱ دقیقه"
},
"polyline": "szf~DigygHk#gAGk#Hg#",
"start_location": [
48.631088,
31.333703
]
},
{
"name": "انقلاب",
"instruction": "در مقصد قرار دارید",
"bearing_after": 0,
"type": "arrive",
"distance": {
"value": 0.0,
"text": ""
},
"duration": {
"value": 0.0,
"text": ""
},
"polyline": "}{f~DelygH",
"start_location": [
48.631869,
31.333913
]
}
]
}
]
}
]
}
In Steps we have 4 points:
[31.333827,48.629912 ],
[31.333717,48.630143 ],
[31.333703,48.631088],
[31.333913,48.631869 ]
When I use polyline my output is like below picture. But real Path is another thing.
I use Leaflet and get my .png file for map from another server and get Json String from another server.
How can Manage this?
A Map Matching API should solve your problem.
Google Snap to Roads API
Mapbox Map Matching API
There also seems to be some open source alternatives like the Valhalla Map Matching API
What was the original directions API request? Curious to see why you're getting that result for that route

How to extract json values from json in javascript

Hello guys I am currently trying to phrase a json but it's hard for me. The json response is
{
"txs":
{
"lock_time": 0,
"ver": 1,
"size": 372,
"inputs": [
{
"sequence": 4294967295,
"prev_out": {
"spent": true,
"tx_index": 78636642,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 61140,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
},
"script": "47304402203409c3381b75deac615630125c62af73e959e4e42431397209d0298da272c4b4022011720c0e8ecc8a4d01e1f6210891fe5e65f581473c05f0b15bc38010ca5155610121038b1c61898ba817c0361fb910c001cddf309388f6e156f96de749fdbb1c531f34"
},
{
"sequence": 4294967295,
"prev_out": {
"spent": true,
"tx_index": 78634898,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 379950,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
},
"script": "473044022051029de181886a8225e78ea8c97fcdff4fdf65bd5479cf4370a8bf38ffd8770002202e788bb00aa4b017249eeefdfcf49cc2e591a7dbb25a1b2a3df924505b7683a50121038b1c61898ba817c0361fb910c001cddf309388f6e156f96de749fdbb1c531f34"
}
,
"doublespend": false,
"time": 1424718521,
"txindex": 78637260,
"vinsz": 2,
"hash": "011931da4d5ef3afde1b043f285b27cec2883b9d77feda71fe67b13341778494",
"voutsz": 2,
"relayedby": "127.0.0.1",
"out": [
{
"addrtaglink": "http://luckyb.it/",
"addrtag": "LuckyBit blue",
"spent": false,
"txindex": 78637260,
"type": 0,
"addr": "1LuckyB5VGzdZLZSBZvw8DR17iiFCpST7L",
"value": 356450,
"n": 0,
"script": "76a914da5dde86d69a5d9dad88763f2df4b048953c7d0488ac"
},
{
"spent": false,
"txindex": 78637260,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 74640,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
}
]
}
]
}
This json is stored in a variable content.
By let content = JSON.parse(result)
I used
var data = content.txs.inputs.addr
to take out the info from that but it shows nothing, null.
I also tried only content and it works, but it doesn’t work with content.txs.inputs.addr. Can any JavaScript developers help me solve this? I’m facing this type of json for the first time.
The object model for the inputs array don't have any addr property, you need to access the prev_out object property to get the addr value.
You are missing an closing ] in the inputs array, and you need to remove the ] at the end of the json file.
After that you can get the addr property in the next way:
const content = {
"txs":
{
"lock_time": 0,
"ver": 1,
"size": 372,
"inputs": [
{
"sequence": 4294967295,
"prev_out": {
"spent": true,
"tx_index": 78636642,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 61140,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
},
"script": "47304402203409c3381b75deac615630125c62af73e959e4e42431397209d0298da272c4b4022011720c0e8ecc8a4d01e1f6210891fe5e65f581473c05f0b15bc38010ca5155610121038b1c61898ba817c0361fb910c001cddf309388f6e156f96de749fdbb1c531f34"
},
{
"sequence": 4294967295,
"prev_out": {
"spent": true,
"tx_index": 78634898,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 379950,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
},
"script": "473044022051029de181886a8225e78ea8c97fcdff4fdf65bd5479cf4370a8bf38ffd8770002202e788bb00aa4b017249eeefdfcf49cc2e591a7dbb25a1b2a3df924505b7683a50121038b1c61898ba817c0361fb910c001cddf309388f6e156f96de749fdbb1c531f34"
}]
,
"doublespend": false,
"time": 1424718521,
"txindex": 78637260,
"vinsz": 2,
"hash": "011931da4d5ef3afde1b043f285b27cec2883b9d77feda71fe67b13341778494",
"voutsz": 2,
"relayedby": "127.0.0.1",
"out": [
{
"addrtaglink": "http://luckyb.it/",
"addrtag": "LuckyBit blue",
"spent": false,
"txindex": 78637260,
"type": 0,
"addr": "1LuckyB5VGzdZLZSBZvw8DR17iiFCpST7L",
"value": 356450,
"n": 0,
"script": "76a914da5dde86d69a5d9dad88763f2df4b048953c7d0488ac"
},
{
"spent": false,
"txindex": 78637260,
"type": 0,
"addr": "1Dihat9Fy1ZDzFCq33LN5M7kzG3Fmi3FbZ",
"value": 74640,
"n": 1,
"script": "76a9148b84711990f82d3cd70013e738787506a2156ebf88ac"
}
]
}
};
// Now you can get the info
content.txs.inputs.forEach(element => {
console.log(element.prev_out.addr);
})
content.txs.inputs is an array. Did you mean var data = content.txs.inputs[0].prev_out.addr;?
You need to go down a couple more steps
inputs is an array, so you need a subscript, then two more levels of keys:
Var data = content.txs.inputs[0].prev_out.addr
Note that there is an addr value in both the inputs elements. Change the subscript to get the other one.
element inputs is an arrray, so you need access each postion in array, you can use for loop for element inputs, access each position such as inputs[0].addr, inputs[1].addr

Displaying a local image in Node-RED dashboard using http endpoints

I need to display an image on Node-RED dashboard using http end points.
I have done the followings:
Kept the image in /home/pi/Pictures.
Edited httpStatic: '/home/pi/Pictures', in setting.js file.
Tried using slash "/" before image name in src in html image tag and
without "/" but nothing works.
Here is my flow for reference:
[
{
"id": "7b08a202.a1670c",
"type": "http in",
"z": "e5e5e9b.2a8cc18",
"name": "",
"url": "/display-image",
"method": "get",
"upload": false,
"swaggerDoc": "",
"x": 112,
"y": 73,
"wires": [
[
"35ca7d97.da9dd2"
]
]
},
{
"id": "f8cf60ed.74b87",
"type": "http response",
"z": "e5e5e9b.2a8cc18",
"name": "",
"statusCode": "",
"headers": {
},
"x": 458,
"y": 70,
"wires": [
]
},
{
"id": "35ca7d97.da9dd2",
"type": "template",
"z": "e5e5e9b.2a8cc18",
"name": "SLD View",
"field": "payload",
"fieldType": "msg",
"format": "handlebars",
"syntax": "mustache",
"template": "<!DOCTYPE html>\n<html>\n <body>\n <img src=\"Barsu_SLD.png\" alt=\"Overview\" width=1000px; height=800px>\n \n </body>\n</html>",
"output": "str",
"x": 310,
"y": 136,
"wires": [
[
"f8cf60ed.74b87"
]
]
},
{
"id": "2beda89c.ca2b98",
"type": "ui_template",
"z": "e5e5e9b.2a8cc18",
"group": "d9e6ccf5.f58ab",
"name": "Display Button",
"order": 0,
"width": 0,
"height": 0,
"format": "<!DOCTYPE html>\n<html>\n <head>\n <style>\n .button {\n background-color: #086A87;\n border: none;\n color: white;\n padding: 16px 32px;\n text-align: center;\n text-decoration: none;\n font-size: 16px;\n margin: 3px 1px;\n cursor: pointer;\n border-radius: 4px;\n }\n .button_over:hover {\n background-color: #187A97;\n color: white;\n }\n </style>\n </head>\n <body>\n \n <a href=\"http://127.0.0.1:1880/BARSU-SLD/\" class=\"button button_over\" target=\"_blank\" >SLD View</a> \n \n </body>\n </html>",
"storeOutMessages": false,
"fwdInMessages": true,
"templateScope": "local",
"x": 112,
"y": 195,
"wires": [
[
]
]
},
{
"id": "d9e6ccf5.f58ab",
"type": "ui_group",
"z": "",
"name": "Test",
"tab": "1474e3ec.fb238c",
"disp": true,
"width": "6"
},
{
"id": "1474e3ec.fb238c",
"type": "ui_tab",
"z": "",
"name": "Home",
"icon": "dashboard"
}
]
Any help is highly appreciable.
If you have httpStatic set to ~/.node-red/public, for example using the following in settings.js
httpStatic: path.join('', 'public'),
and if you have a file: ~/.node-red/public/images/myimage.png
Then your url should use the html
<img src="/images/myimage.png">
Note the initial / and the lack of any http://localhost:1880. You don't need to supply the http part since your browser will automatically match that up for you.
Just note also that if you have set httpRoot to something, you need to prefix your URL's with that as well.

Google Chrome Apps: chrome.storage.local

I am having a struggle finding out why the following is happening in a application i'm developing:
So i read a JSON file where i want to read and save his content on localStorage, which in a chrome app is chrome.storage.local
So i get the following from a json file:
{
"schedule": {
"id": "416a18d6-7e42-4f8a-ac24-e902abe76f39",
"name": "blabla",
"updatedOn": "2013-09-08T16:34:41.000Z",
"etag": "esxrdctfvygbuhnij5464df7g8hu",
"applications": [
{
"id": "app001",
"type": "text/html",
"src": "http://www.google.com"
},
{
"id": "app002",
"type": "text/html",
"src": "http://www.stackoverflow.com"
}
],
"normalContent": [
{
"layout_id": "layout001",
"layout_name": "layout1",
"layout_dur": "indefinite",
"regions": [
{
"region_id": "region001",
"region_name": "regiao1",
"left": "0",
"top": "0",
"width": "0.5",
"height": "1",
"minWidth": "0",
"minHeight": "0",
"scheduleItem": "container",
"limitCycle": "1",
"selector": "seq",
"containerList": [
{
"cid": "app001",
"dur": "25"
},
{
"cid": "app002",
"dur": "15"
}
]
},
{
"region_id": "region002",
"region_name": "regiao2",
"left": "0.5",
"top": "0",
"width": "0.5",
"height": "1",
"minWidth": "0",
"minHeight": "0",
"scheduleItem": "container",
"limitCycle": "1",
"selector": "seq",
"containerList": [
{
"cid": "app002",
"dur": "15"
},
{
"cid": "app001",
"dur": "15"
}
]
}
]
}
]
}
}
So i get this and then i save the content in storage using:
chrome.storage.local.set({playerSchedule:this.schedule}, function(){
console.log('saved!')
});
Later on when i read the content stored using:
chrome.storage.local.get(["playerSchedule", "playerScheduleType"], function (res) {
self.currentSchedule = res.playerSchedule;
self.scheduleType = res.playerScheduleType;
});
This is what i get:
{
"schedule": {
"applications": [
{
"id": "app001",
"type": "text/html",
"src": "http://www.google.com"
},
{
"id": "app002",
"type": "text/html",
"src": "http://www.stackoverflow.com"
}
],
"etag": "esxrdctfvygbuhnij5464df7g8hu",
"id": "416a18d6-7e42-4f8a-ac24-e902abe76f39",
"name": "blabla",
"normalContent": [
{
"layout_dur": "indefinite",
"layout_id": "layout001",
"layout_name": "layout1",
"regions": [
{
...
"containerList": [
]
},
{
...
"containerList": [
]
}
]
}
],
"updatedOn": "2013-09-08T16:34:41.000Z"
}
}
As you can observe, the content i read comes in alphabetic order and the content in containerList is empty. Any reason why this is happening? I solved this by converting the object to string and storing it, but i wonder why saving as object i get that from reading as an object or is there something i am missing?
Thanks in advance.
This is probably http://code.google.com/p/chromium/issues/detail?id=277647. Fix is in the works for Chrome 31.

How to get image url

If I parse a Tweet from the Twitter API using:
tweet.entities.media
I get the below json. But how would I access media_url property? Its nested in a really difficult place inside the json object.
tweet.entities.media[0].media_url
returns an error.
{
"image": [
{
"id": 511403875438301200,
"id_str": "511403875438301185",
"indices": [
44,
66
],
"media_url": "http://some_url.jpg",
"media_url_https" : "https: //some_url.jpg",
"url": "http://whatever.com",
"display_url": "pic.twitter.com/BNIPh3ZlRD",
"expanded_url": "https://twitter.com/some_url/1",
"type": "photo",
"sizes": {
"thumb": {
"w": 150,
"h": 150,
"resize": "crop"
},
"small": {
"w": 680,
"h": 482,
"resize": "fit"
},
"large": {
"w": 2048,
"h": 1453,
"resize": "fit"
},
"medium": {
"w": 1200,
"h": 851,
"resize": "fit"
}
}
}
]
}
how would I access media_url?
It appears to me that you are just missing image[0]:
tweet.entities.media.image[0].media_url
$(document).ready(function() {
var tweet = jQuery.parseJSON( '{"entities":{"media":{"image":[{"id":511403875438301200,"id_str":"511403875438301185","indices":[44,66],"media_url":"http://pbs.twimg.com/media/BxjfHXxCEAETmig.jpg","media_url_https":"https: //pbs.twimg.com/media/BxjfHXxCEAETmig.jpg","url":"http://whatever.com","display_url":"pic.twitter.com/BNIPh3ZlRD","expanded_url":"https://twitter.com/AWish4Me/status/511403876642463744/photo/1","type":"photo","sizes":{"thumb":{"w":150,"h":150,"resize":"crop"},"small":{"w":680,"h":482,"resize":"fit"},"large":{"w":2048,"h":1453,"resize":"fit"},"medium":{"w":1200,"h":851,"resize":"fit"}}}]}}}');
document.body.innerHTML = tweet.entities.media.image[0].media_url;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
I think I got it.
It was breaking because some of the Tweets didn't have images..
I had to check for empty properties...
return {"image_url":(tweet.entities.media!==undefined)?((tweet.entities.media[0]!=="")?(tweet.entities.media[0].media_url):('')): ('') };

Categories