Problems during getting data from external JSON in D3.js - json

I'm trying to load some data from the external JSON file to put them into the tooltip, but something is going wrong and I can't figure it out. My JSON looks like this:
{
"results": [
{
"name": "First Candidate",
"result": 52,
"victory": "winner",
"region": "First region",
"constituencyName": "First constituency",
"constituencyNumber": 1,
"partyName": "Ruling party",
"partyShort": "PR",
"partyStatus": "Right"
},
{
"name": "Second Candidate",
"result": 48,
"victory": "looser",
"region": "First region",
"constituencyName": "First constituency",
"constituencyNumber": 1,
"partyName": "Opposition party",
"partyShort": "OP",
"partyStatus": "Left"
}
]
}
It's the part of my code where I'm trying to get the data:
d3.json("test_json.json", function(error, data) {
dataViz(data.results);
});
Here is the full code on jsfiddle: http://jsfiddle.net/anton9ov/v1rz2vfu/

Use the full address for the json : http://jsfiddle.net/thatOneGuy/v1rz2vfu/15/
d3.json("https://dl.dropboxusercontent.com/u/23920803/infographics/2016/2016.08.29_elections_results/my_files/test_json/test_json.json", function(error, data) {
dataViz(data.results);
});

Related

how do i integrate authorize.net into my wix page?

I am using authorize.net's sandbox API to test their gateway in my wix (corvid/code) environment. Funny thing is that when i send JSON to the sandbox API i get a valid JSON response approving the (fake) transaction. however when i set it up thru wix i get data errors in my console. I have built on existing files that i have been able to run basic API responses, and more advanced auths with token responses. so the code works, just not with authorize.net. given my level of expertise, i think it might be something im doing wrong. i've done my due diligence, and there are no questions on this topic. here is my code:
///front end, from the corvid page's code
import {buyIt} from 'backend/authorizeNet';
export function button1_click(event) {
buyIt();
}
pretty basic, just calling code from my backend onClick. the filepath is correct. here is the module on the backend:
//// backend/authorizeNet.jsw
import {fetch} from 'wix-fetch';
export function buyIt() {
let data = {
"createTransactionRequest": {
"merchantAuthentication": {
"name": "***************",
"transactionKey": "****************"
},
"refId": "123456",
"transactionRequest": {
"transactionType": "authCaptureTransaction",
"amount": "5",
"payment": {
"creditCard": {
"cardNumber": "5424000000000015",
"expirationDate": "2020-12",
"cardCode": "999"
}
},
"lineItems": {
"lineItem": {
"itemId": "1",
"name": "vase",
"description": "Cannes logo",
"quantity": "18",
"unitPrice": "45.00"
}
},
"tax": {
"amount": "4.26",
"name": "level2 tax name",
"description": "level2 tax"
},
"duty": {
"amount": "8.55",
"name": "duty name",
"description": "duty description"
},
"shipping": {
"amount": "4.26",
"name": "level2 tax name",
"description": "level2 tax"
},
"poNumber": "456654",
"customer": {
"id": "99999456654"
},
"billTo": {
"firstName": "Ellen",
"lastName": "Johnson",
"company": "Souveniropolis",
"address": "14 Main Street",
"city": "Pecan Springs",
"state": "TX",
"zip": "44628",
"country": "USA"
},
"shipTo": {
"firstName": "China",
"lastName": "Bayles",
"company": "Thyme for Tea",
"address": "12 Main Street",
"city": "Pecan Springs",
"state": "TX",
"zip": "44628",
"country": "USA"
},
"customerIP": "192.168.1.1",
"transactionSettings": {
"setting": {
"settingName": "testRequest",
"settingValue": "false"
}
},
"userFields": {
"userField": [
{
"name": "MerchantDefinedFieldName1",
"value": "MerchantDefinedFieldValue1"
},
{
"name": "favorite_color",
"value": "blue"
}
]
}
}
}
}
return fetch("https://test.authorize.net/xml/v1/request.api", {
"method": "post",
"headers": {"Content-Type": "application/json"},
"body": data
})
.then(response => {console.log(response.json())});///if response.text is used, it gives details
}
note at the end of the backend code, calling response.json give me a json error, due to the return code contains HTML saying that i've requested invalid data. if i change it to response.text i get this in my console:
//console response with response.text
{...}
isFulfilled:
true
isRejected:
false
fulfillmentValue:
"<HTML><HEAD>\n<TITLE>Bad Request</TITLE>\n</HEAD><BODY>\n<H1>Bad Request</H1>\nYour browser sent a request that this server could not understand.<P>\nReference #7.1d60fea5.1557756725.387c74\n</BODY>\n</HTML>\n"
how do i get a good response from the API? like ive done with the same code in postman?
thanks in advance
return fetch(url, {
method: "post",
headers: {"Content-Type": "application/json"},
body: JSON.stringify(data)
})
.then(response => console.log(response.text())
)
this got me the result i was looking for
stringify() converted my object to a JSON string. i still cannot get it to read the incoming JSON, might have to use parse...but if i read as text i get the info i want and my API is showing a successful transaction.

Using Axios and Vue.js to load JSON data

I'm trying to display JSON data on my webpage by using the v-for function in Vue.js and Axios to get the data. Below is my code and an example of the JSON data i'm trying to use.
I have kept the JSON data URL out on purpose as it's private, which is why i've provided an example of the data structure.
I can print the entire data set to my page, as it appears below but if i use my code below to print specific parts of data, like the id or name, that's when i get nothing on the page.
<div id="root">
<p v-for="item in items">{{ item.name }}</p>
</div>
<script>
var app = new Vue({
el: '#root',
data: {
items: []
},
mounted() {
axios.get("...")
.then(response => {this.items = response.data.data})
}
});
</script>
JSON data example:
json
{
"current_page": 1,
"data": [
{
"id": "83",
"name": "Name1",
},
{
"id": "78",
"name": "Name2",
},
{
"id": "720",
"name": "Name3",
},
{
"id": "707",
"name": "Name4",
},
{
"id": "708",
"name": "Name5",
}
],
"from": 1,
"prev_page_url": null,
"to": 20,
"total": 42
}
looking at the code everything looks ok, but i have an example in the application i am working on and i've noticed that your items array should contain response.data.data.data wich is verbose but you can work on that later

How to Check a value in a nested JSON using Postman

I have a nested JSON returned from an API that I am hitting using a GET request, in POSTMAN chrome app. My JSON looks like this.
{
"resultset": {
"violations": {
"hpd": [
{
"0": {
"ViolationID": "110971",
"BuildingID": "775548",
"RegistrationID": "500590",
"Boro": "STATEN ISLAND",
"HouseNumber": "275",
"LowHouseNumber": "275",
"HighHouseNumber": "275",
"StreetName": "RICHMOND AVENUE",
"StreetCode": "44750",
"Zip": "10302",
"Apartment": "",
"Story": "All Stories ",
"Block": "1036",
"Lot": "1",
"Class": "A",
"InspectionDate": "1997-04-11",
"OriginalCertifyByDate": "1997-08-15",
"OriginalCorrectByDate": "1997-08-08",
"NewCertifyByDate": "",
"NewCorrectByDate": "",
"CertifiedDate": "",
"OrderNumber": "772",
"NOVID": "3370",
"NOVDescription": "§ 27-2098 ADM CODE FILE WITH THIS DEPARTMENT A REGISTRATION STATEMENT FOR BUILDING. ",
"NOVIssuedDate": "1997-04-22",
"CurrentStatus": "VIOLATION CLOSED",
"CurrentStatusDate": "2015-03-10"
},
"count": "1"
}
]
}
},
"count": "1",
"total_page": 1,
"current_page": 1,
"limit": [
"0",
"1000"
],
"status": "success",
"error_code": "",
"message": ""
}
I am trying to test whether my response body has "ViolationID":"110971".
I tried the below code in postman:
var jsonData =JSON.parse(responseBody);
tests["Getting Violation Id"] = jsonData.resultset.violations.hpd[0].ViolationID === 110971;
Two issues I noticed in the provided data. The following suggestions might help you:
Add missing closing braces at the end.
Add missing 0 in the index like this: resultset.violations.hpd[0].0.ViolationID
If the hpd array always contains only 1 member, the test might be pretty straightforward:
pm.test('Body contains ViolationID', () => {
const jsonBody = pm.response.json();
const violationId = jsonBody.resultset.violations.hpd[0]["0"].ViolationID;
pm.expect(parseInt(violationId)).to.eql(110971);
})
However, if hpd array might contain more than one member, it gets a bit trickier. I would suggest mapping only ViolationID keys from nested objects:
pm.test('Body contains ViolationID', () => {
const jsonBody = pm.response.json();
const violationIds = jsonBody.resultset.violations.hpd.map(hpd => hpd["0"].ViolationID);
pm.expect(violationIds).to.contain('110971');
})

Parsing from a JSON file in Ruby and Extract numbers from Nested Hashes

Now I am working on extracting information from a JSON file in Ruby. Then how can I extract just the numbers next to the word 'score' from the following text file? For example, I want to get 0.6748984055823062, 0.6280145725181376 on and on.
{
"sentiment_analysis": [
{
"positive": [
{
"sentiment": "Popular",
"topic": "games",
"score": 0.6748984055823062,
"original_text": "Popular games",
"original_length": 13,
"normalized_text": "Popular games",
"normalized_length": 13,
"offset": 0
},
{
"sentiment": "engaging",
"topic": "pop culture-inspired games",
"score": 0.6280145725181376,
"original_text": "engaging pop culture-inspired games",
"original_length": 35,
"normalized_text": "engaging pop culture-inspired games",
"normalized_length": 35,
"offset": 370
},
"negative": [
{
"sentiment": "get sucked into",
"topic": "the idea of planning",
"score": -0.7923352042939829,
"original_text": "Students get sucked into the idea of planning",
"original_length": 45,
"normalized_text": "Students get sucked into the idea of planning",
"normalized_length": 45,
"offset": 342
},
{
"sentiment": "be daunted",
"topic": null,
"score": -0.5734506634410159,
"original_text": "initially be daunted",
"original_length": 20,
"normalized_text": "initially be daunted",
"normalized_length": 20,
"offset": 2104
},
What I have tried is that I could read a file and set the text file to a hash variable using the JSON method.
require 'json'
json = JSON.parse(json_string)
Using the JSON class:
Importing a file:
require "json"
file = File.open "/path/to/your/file.json"
data = JSON.load file
Optionally, you can close it now:
file.close
The file looks like this:
{
"title": "Facebook",
"url": "https://www.facebook.com",
"posts": [
"lemon-car",
"dead-memes"
]
}
The file is now able to be read like this:
data["title"]
=> "Facebook"
data.keys
=> ["title", "url", "posts"]
data['posts']
=> ["lemon-car", "dead-memes"]
data["url"]
=> "https://www.facebook.com"
Hope this helped!
Parse Data from File:
data_hash = JSON.parse(File.read('file-name-to-be-read.json'))
Then just map over the data!
reviews = data_hash['sentiment_analysis'].first
reviews.map do |sentiment, reviews|
puts "#{sentiment} #{reviews.map { |review| review['score'] }}"
end
I think this is the simplest answer.
You can use Array#map to collect the reviews.
reviews = json['sentiment_analysis'][0]
positive_reviews = reviews['positive']
negative_reviews = reviews['negative']
positive_reviews.map { |review| review['score'] }
=> [0.6748984055823062, 0.6280145725181376]
negative_reviews.map { |review| review['score'] }
=> [-0.7923352042939829, -0.5734506634410159]
Hope this helps!

Select2 json data not working

I am trying to hook select2 when an element has class "select2picker" i am also customising if the source of the dropdown list is an array. My code below
$('.select2picker').each(function() {
var settings = {};
if ($(this).attr('data-json')) {
var jsonValue = JSON.parse($(this).attr('data-json')).val());
settings = {
placeholder: $(this).attr('data-placeholder'),
minimumInputLength: $(this).attr('data-minimumInputLength'),
allowClear: true,
data: jsonValue
}
}
$(this).select2(settings);
});
but the result is horrible it fails to hook all the select2 dropdownlist
but when I comment out the data property, the output shows perfect (but the data binding goes missing)
My array looks like the following
[ { "id": "2015-0152", "text": "2015-0152" }, { "id": "2015-0153", "text": "2015-0153" }, { "id": "2016-0001", "text": "2016-0001" }, { "id": "2016-0002", "text": "2016-0002" }, { "id": "2016-0003", "text": "2016-0003" }, { "id": "2016-0004", "text": "2016-0004" }, { "id": "2016-0005", "text": "2016-0005" }, { "id": "2016-0006", "text": "2016-0006" }, { "id": "2016-0007", "text": "2016-0007" }, { ... }, { "id": "2015-0100", "text": "2015-0100" }, { "id": "2015-0101", "text": "2015-0101" }, { "id": "2015-0080", "text": "2015-0080" }, { "id": "2015-0081", "text": "2015-0081" }, { "id": "2015-0090", "text": "2015-0090" }, { "id": "2015-0102", "text": "2015-0102" }, { "id": "2015-0112", "text": "2015-0112" }, { "id": "2015-0128", "text": "2015-0128" }, { "id": "2015-0136", "text": "2015-0136" } ]
I am really confused about what is going wrong. Any idea?
Select2 version: 3.4.8
This line gives an error: var jsonValue = JSON.parse($(this).attr('data-json')).val());
Should be: var jsonValue = JSON.parse($(this).attr('data-json'));.
Also this line in your question:
i am also customising if the source of the dropdown list is an array
Indicates to me that it might also not be an array. In that cause you should check if it is an array before you pass the data to select2.
EDITED: Another thing that came to my mind was the following.
If you're using data properties for the placeholder I don't think you need to pass the values of those properties to select2 a second time like you do here
placeholder: $(this).attr('data-placeholder'),
minimumInputLength: $(this).attr('data-minimumInputLength'),
Might be that you need to pick one of the two (either pass it along in your settings, or use an attribute). As select2 looks at the data attributes to get a value.
I checked if the above was correct turns out it isn't. It works fine in this fiddle: https://jsfiddle.net/wL7oxbpv/
I think there is something wrong with your array data. Please check that.