Sweden Bar (example)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="http://json-stat.org/lib/json-stat.js"></script> <link rel="stylesheet" href="http://idescat.github.io/visual/visual.css" /> <script src="http://idescat.github.io/visual/lazyvisualsetup.js"></script> <script>ur={"dataset":{"status":{"6":".."},"dimension":{"Kon":{"label":"sex","category":{"index":{"1+2":0},"label":{"1+2":"total"}}},"Alder":{"label":"age","category":{"index":{"15-19":0,"20-24":1,"25-34":2,"35-44":3,"45-54":4,"55-64":5,"65-74":6},"label":{"15-19":"15-19 years","20-24":"20-24 years","25-34":"25-34 years","35-44":"35-44 years","45-54":"45-54 years","55-64":"55-64 years","65-74":"65-74 years"}}},"Arbetskraftstillh":{"label":"labour status","category":{"index":{"ALÖS":0},"label":{"ALÖS":"unemployed"}}},"Tid":{"label":"year","category":{"index":{"2015":0},"label":{"2015":"2015"}}},"id":["Kon","Alder","Arbetskraftstillh","Tid"],"size":[1,7,1,1],"role":{"time":["Tid"]}},"label":"Population aged 15-74 (LFS), percent by sex, age, labour status and year","source":"Statistics Sweden","updated":"2016-08-22T11:33:00Z","value":[32.8,15.8,7.5,5.3,4.6,5.3,null]}};</script> </head> <body> <div id="visual" class="visual"></div> <script> ds=JSONstat(ur).Dataset(0); visual({ lang: "en", type: "bar", title: "Unemployment rate by age group", footer: ds.source, time: ds.Dimension("Tid").Category(0).label, by: ds.Dimension("Alder", false), data: ds.value, dec: 1 }); </script> </body> </html>
Presentation and Programme
Templates and Examples (Browser supporting Fetch required. For example, Google Chrome)
Bar Chart (template) Pyramid (template) Line Chart (template) Map (template) jQuery Post (template) Async JSONstat (template) Responsive Iframe (template) Sweden Bar (example) Norway Pyramid (example) Denmark Pyramid (example) Finland Bar (example) Greenland Pyramid (example) Faroe Islands Pyramid (example) Iceland Line (example) Norway Map (example)