Published
Edited
Nov 17, 2021
1 fork
{
ixmaps.waitForMap('map1',map => map
.setData(final_data,{"name":"PIVOT_F_M_T","type":"jsonDB"})
.loadProject(project())
);
return project();
}
project = () => {
return {
"$schema": "https://gjrichter.github.io/ixmaps/schema/ixmaps/v1.json",
"map": {
"map": "",
"basemap": "white",
"legend": "<h3>Visualizzazione dei dati del referendum per l'eutanasia con il numero di firma per provincia e sesso.</h3><p>Il diametro delle Torte rappresenta la percentuale della popolazione che ha votato.</p><p><b>Nota: le percentuali femmine/maschi sono sempre calcolate con il totale della popolazione (da megliorare!)",
"item": "html",
"scaleParam": {
"normalSizeScale": "5000000"
},
"options": {
"featurescaling": "dynamic",
"objectscaling": "dynamic",
"panhidden":"false",
"flushChartDraw":"100000"
},
"center": {
"lat": "41.98807738309159",
"lng": "12.54638671875"
},
"zoom": "6"
},
"themes": [
theme_geo(),
theme_chart()
]
}
}
theme_chart = () => {
return {
"layer": "Province_2019",
"field": "F|M",
"field100": "pop",
"style": {
"type": "CHART|PIE|SIZEP1|VALUES|SIMPLELEGEND|RECT|SUM|FORCE",
"colorscheme": [
"red",
"blue"],
"fillopacity": "0.5",
"shadow": "false",
"dbtable": "PIVOT_F_M_T",
"lookupfield": "codiceProvincia",
"units": "%",
"scale": "1",
"gridwidth": "50px",
"titlefield": "denominazioneProvincia",
"title": "Firme Referendum Eutanasia -percentuali della intera popolazione ",
"snippet": "Percentuali della intera popolazione",
"description": "Visualizzazione dei dati con il numero di firma per provincia e sesso, aqggregati per una griglia rettangolare. Il diametro delle Torte rappresenta il numero di voti per 100.000 abitanti"
}
}
}
theme_chart_text = () => {
return {
"layer": "Province_2019",
"field": "Total",
"field100": "",
"style": {
"type": "CHART|LABEL|VALUES|TEXTONLY|NOSIZE",
"colorscheme": [
"none"],
"fillopacity": "1",
"shadow": "false",
"dbtable": "PIVOT_F_M_T",
"lookupfield": "codiceProvincia",
"units": "",
"scale": "1.5",
"textcolor": "white",
"titlefield": "denominazioneProvincia",
"title": "Firme Referendum Eutanasia",
"description": "Visualizzazione dei dati con il numero di firma per provincia e sesso, aqggregati per una griglia rettangolare. Il diametro delle Torte rappresenta il numero di voti per 100.000 abitanti"
}
}
}
data = d3.csv("https://raw.githubusercontent.com/ondata/dati-referendum/main/output/cannabis_prov.csv?token=AAU2D3PHY6PHYYX43ZATSV3BTFAVK")
Inputs.Table(data)
pop = d3.csv("https://s3.eu-west-1.amazonaws.com/data.ixmaps.com/ISTAT/DCIS_POPRES_Province_2019.csv")
Inputs.Table(pop)
pivot = Data.import({"source":data,"type":"json"})
.select(filter.filter)
.pivot({
lead: "codiceProvincia",
columns: "sesso",
value: "numeroFirme",
keep: ["denominazioneProvincia"]
});
Inputs.Table(pivot.json())
// make lookupArray: COD_PROV ==> population
popA = Data.import({"source":pop,"type":"json"}).lookupArray("Value","COD_PROV");
totalColumn = pivot.column("Total").index;
pivot_2 = pivot
.addColumn({destination:"incidenza"},function(row){
return ((Number(row[totalColumn]))/popA[Number(row[0])]*100000).toFixed(2);
})
.addColumn({destination:"pop"},function(row){
return (popA[Number(row[0])]);
})
final_data = pivot_2;
Inputs.Table(final_data.json())
---
Appendice
Inputs = require("@observablehq/inputs@0.7.21/dist/inputs.umd.min.js")
ixmaps = require('https://gjrichter.github.io/ixmaps/ui/js/htmlgui_api.js')
Data = require('https://gjrichter.github.io/data.js/data.js')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
