Skip to content

Instantly share code, notes, and snippets.

@badosa
Last active November 4, 2019 22:21
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save badosa/60f323668199cd972c75 to your computer and use it in GitHub Desktop.
Children Aged 0-4 in Norway
<!DOCTYPE html>
<html>
<head>
<title>Iterating through a dimension</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- DO NOT DO THIS IN PRODUCTION -->
<!-- js.org IS NOT A CDN! Link to your own copies or to a CDN. -->
<link href="https://visual.js.org/visual.css" rel="stylesheet" type="text/css" />
<script src="https://visual.js.org/lazyvisualsetup.js"></script>
<!-- /DO NOT DO THIS IN PRODUCTION -->
<script>
function main( obj ){
var jsonstat=JSONstat( obj );
if( !jsonstat ){
return;
}
var
values=[],
dimension=jsonstat.dimension,
time=getBy( dimension[by].category.index )
;
time.forEach(function( e , i ){
query[by]=e;
values[i]=getValue( query );
});
visual({
lang: "en",
title: "Children aged 0-4 years",
geo: "Norway",
time: time,
footer: "Source: Statistics Norway.",
type: "tsline",
data: [{ label: "", val: values }],
dec: 0,
grid: {
shadow: 0,
point: 0
},
axis: {
x: false
},
legend: false
});
//Functions
function getBy( ndx ) {
if( isArray( ndx ) ){
return ndx;
}else{
var arr=[];
for( var p in ndx ){
arr[ndx[p]]=p;
}
return arr;
}
}
//getValue() converts a dimension/category object into a data value.
function getValue( query ){
return jsonstat.value[getValueIndex( getDimIndices( query ) )];
}
//getDimIndices() converts a dimension/category object into an array of dimensions' indices.
function getDimIndices( query ){
var ids=jsonstat.id || dimension.id; //JSON-stat 2.0-ready
for( var arr=[], i=0, len=ids.length; i<len ; i++ ){
arr[i]=getDimIndex( ids[i] , query[ids[i]] );
}
return arr;
}
//getValueIndex() converts an array of dimensions' indices into a numeric value index.
function getValueIndex( indices ){
var size=jsonstat.size || dimension.size; //JSON-stat 2.0-ready
for( var i=0, ndims=size.length, num=0, mult=1; i<ndims; i++ ){
mult*=( i>0 ) ? size[ndims-i] : 1;
num+=mult*indices[ndims-i-1];
}
return num;
}
//getDimIndex() converts a dimension ID string and a category ID string into the numeric index of that category in that dimension.
function getDimIndex( name , value ){
//In single category dimensions, "index" is optional
if( !dimension[name].category.index ){
return 0;
}
var ndx=dimension[name].category.index;
//"index" can be an object or an array
if( !isArray( ndx ) ){ //Object
return ndx[value];
}else{ //Array
return ndx.indexOf( value ); //Polyfill required in old browsers
}
}
//Validate
function JSONstat( jsonstat ){
if( !jsonstat ){
window.alert( 'Error: no response could be retrieved.' );
return NULL;
}
//If no "class", "bundle" response:
//use the first dataset available
//(assuming single dataset bundle response)
//[Of course, it'd be better to add an argument
//to the function to pass a dataset ID if
//bundle responses must be properly supported.]
if( !jsonstat.class ){
jsonstat=jsonstat[Object.keys( jsonstat )[0]]; //Polyfill required in old browsers
}else{ //Verify it's a "dataset" response
if( jsonstat.class!=='dataset' ){
window.alert( 'Error: response was not a JSON-stat bundle or dataset response.' );
return NULL;
}
}
//Program requires "value" and "dimension" properties
if( !jsonstat.value || !jsonstat.dimension ){
window.alert( 'Error: response is not valid JSON-stat or does not contain required information.' );
return NULL;
}
return jsonstat;
}
function isArray( arr ){
return (Object.prototype.toString.call( arr )==="[object Array]");
}
}
</script>
</head>
<body>
<section id="visual" class="visual"></section>
<script>
var
query={
"Alder": "F00-04", //Age: 00-04
"Kjonn": "0", //Sex: Both sexes
"ContentsCode": "Personer" //People
},
by="Tid" //Time
;
</script>
<script src="https://data.ssb.no/api/v0/dataset/65195.json?callback=main"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment