I am fairly new to JSON and I want to create a choropleth example as so. http://gabrielflor.it/a-half-decade-of-rising-poverty Whenever the years are clicked it just goes to a different portion of the JSON (I'm assuming). Is this how functionality like this is usually done to avoid redrawing the whole map again and calling another JSON.js file? If so these .JSON files can get quite large?
Using a JSON is only a way to store values you need for each year. When you switch to another year the JS parse the JSON for the giving year and update the choropleth. For the example you have provided, here is the JSON used:
http://gabrielflor.it/static/data/saipe.json
This is a good way since you only have one JSON with every year you need and you load it only once. However since d3 needs datas this way I think you should add another JSON if you want to provide additional data like in gabrielflor example:
http://gabrielflor.it/static/js/d3.poverty-by-county.js?v=121107
He loads JSON like this with d3:
d3.json('../static/data/states.json', function (json) {
states = json;
});
or
d3.json('../static/data/saipehighlights.json', function (json) {
saipehighlights = json;
});
If you look at the network traffic for the example page you gave (ex. by using Chrome Developer Tools).
The file with the poverty data is quite large, but the mapping data file is even larger. You'll notice, that it takes longer for the website to load, but afterwords it runs very smoothly in the client without making any server calls.
The site is just about browsing information and nice design - for that purpose I think a longer load time is quite acceptable if the user experience after is smoother(i.e. user doesn't have to wait for year data to load).
Related
I'm making a website that gets its info from a RESTapi I've written and hosted myself, have had no data problems thus far.
Now I'm trying a simple retrieve of a json object and I get all the info correctly as shown here in the API. (Visualized & tested in Swagger)
As you can clearly see, it retrieves it the complete object and underlying objects correctly (blurred sensitive info).
Pay attention to the property "AmountOfEggs" though.
Now when i call this api endpoint (exactly the same way) in my site and console.log the result.data, this is the feedback.
Now for some reason I can't recieve AmountOfEggs in my frontend.
I've recreated the entire object, wrote different names, passed different props (Id, NumberBus, etc are passed in this situation with no problem, which are also int (number) types).
I have no idea why this property gets "dropped" in the transfer and filled with/defaults to an empty string.
Any help would be greatly appreciated.
I found where it went wrong and it's due to different factors.
To start, I am making this site using the Vue framework, which has reactive components, which means, data gets adjusted and you get live updated components on your views/pages.
In the page that contained the call, I also wanted to add dynamic styling. The code I used for this is the following:
v-for="seller in retrievedSellers"
:key="seller.Id"
:class="[
'sellerStyle'
, (seller.AmountOfEggs = 0 ? 'grey-out-seller' : ''),
]"
Now two things to note, first of all this might look like backend coding but this is Vue logic on the .vue file which handles the dynamic options that Vue provides so I never thought to look here for the error.
The error of couse is the 'seller.AmountOfEggs = 0' part, using one equal sign (assignment) instead of two (comparison).
So I learned,
Vue doesn't throw errors on assignments in code that is used to generate frontend (where you should NEVER alter your data).
My console.log was the moment the response of the API came in, where apparently it was already assigned a new value (due to my code above) before hitting the console.log.
It still greatly surprises me that Vue handles ^this^ first to make sure your reactive components are up to date before finishing the api call itself.
However, I still don't understand how it said "" instead of 0.
I'm using typescript (javascript strongly-typed) so it definitely wants to contain a number and not an empty string. Even in the declaration of my DTO the property is defined as (and expects) a number.
I'm working on a simple ruby script with cli that will allow me to browse certain statistics inside the terminal.
I'm using API from the following website: https://worldcup.sfg.io/matches
require 'httparty'
url = "https://worldcup.sfg.io/matches"
response = HTTParty.get(url)
I have to goals in mind. First is to somehow save the JSON response (I'm not using a database) so I can avoid unnecessary requests. Second is to check if the new data is available, and if it is, to override the previously saved response.
What's the best way to go about this?
... with cli ...
So caching in memory is likely not available to you. In this case you can save the response to a file on disk.
Second is to check if the new data is available, and if it is, to override the previously saved response.
The thing is, how can you check if new data is available without doing a request for the data? Not possible (given the information you provided). So you can simply keep fetching data every 5 minutes or so and updating your local file.
Here's my question: How might I try to get rid of the 'skipping precaching' and cache everything that comes in from https://laoadventist.info/beta/r as the precache list?
Also, is it correct for me to set precache="https://laoadventist.info/beta/r" or should I be setting that to a function that grabs the data and returns it instead?
Skipping precaching: Cannot read property 'concat' of null
comes out on the console when using My Polymer App
<platinum-sw-cache default-cache-strategy="fastest" cache-config-file="cache-config.json" precache="https://laoadventist.info/beta/r">
I am assuming correctly I can precahce a URL like this, right?
I am trying to load a json result from laravel 5.1 to set what my precache should be... I know it's not the most elegant, but I'm new to Polymer, cache, service workers, etc, and using this app as a learning opportunity. It'll be a bit different at the end of the day, but for now I just want to load everything. :)
I want to precache all of the data so that a user can fully utilize this app when offline (though later I'll set it up so that they don't have to precache loads and loads of json requests, only the ones they want, like per book - but that's for later).
If you have a array of resource URLs that you want precached, the cleanest way to specify them is to use the cacheConfigFile option and to point to a JSON file that contains your array as its precache property. Take a look at the example in the docs for cacheConfigFile: https://elements.polymer-project.org/elements/platinum-sw?active=platinum-sw-cache
You shouldn't have to use the precache attribute on the element if you're using cacheConfigFile.
It sounds like you're using Polymer Starter Kit, and that will create the JSON config file and populate it for you with an array corresponding to your local resources. But if you'd like to specify additional resources to be precached, you can modify the build process to append those URLs to the auto-generated list.
The reason you're seeing that error is because you're pointing to a JSON config file that is effectively empty, and is just meant for the development environment.
First of all I'm very confused with this "JSON" thing, I can't completely get all the concepts but what I actually want to do is some kind of recipes Mobile Phonegap/kendo-UI(or whatever framework) App which should load data from JSON object. But I don't have a website where I could store data. So, what would be options to save and load data from JSON to my app? I mean it's very confusing to ask this, because I actually can't get the JSON, so I'am ready to get a lot of Dislikes but I want to know how to do a thing like that. I don;t know what URL to write and other stuff.
Hope someone will get what I acutally want and if this idea for loading data from JSON is not what I need, hope someone would like to offer other possibilities. Thank you.
Yes, you can technically save JSON files locally to your app, then retrieve that data locally. At the end of the day, it's not much different than getting it from a web service (other than the fact that it's going to be static data).
Not to get into too much detail here (This site has plenty of info), but JSON is a lightweight flavor of XML for passing data back and forth, very suitable for web services. All it is is key-value pairs. So, in your case, it'll be something like:
{ ["RecipeID" : 1,
"RecipeName" : "PB&J",
"RecipeIngredients" : ["Peanut butter", "Jelly", "Bread" ],
"RecipeDirections" : "If you really have to look this up on an app..."],
["RecipeID" : 2,
// ...
]
}
As you can see, it reads pretty clean and is easy to parse. So, in PhoneGap, you'd probably use jQuery and do something like,
$.getJSON("URLorLocationOfJSONfile", null, function(recipes) {
$.each(recipes, function(i,r) {
alert("Today, I'd like to eat... " + r.RecipeName);
)};
)};
And thus iterate through the JSON contents. Put them in a list or something. Whatever you'd like at that point. I build all my PhoneGap apps with JSON on the backend, so you're going in the right direction with that.
You can host the JSON file somewhere out there if you don't want to build an API for it, too. Just replace it when you get new recipes.
Hope that's a start.
I am developing an iOS app that uses a single context architecture. I make frequent calls to my API (PHP) and I want to "cache" the output for as long as the session is active. Right now I am saving the output to a variable that is defined in the app.s.
var contacts = {
contactsData: null
};
So I do this to save the output, is it really a good idea? Will it slow things down?
contacts.contactsData = output;
Thankful for all input!
It consist of how big is json file in mb. If device have enough RAM - it is the best way. Also be sure you save decoded json not just request response, so you will not decode it every time.
If json data is too big you must think about some kind of local storage. If Json is always the same (no need to synch every time) save it local.
If you need update it often you can upload extremly needed part with 1 limited request (API config needed) and other data with second background request.