div = html`<div style="weight:1024px;height:720px;background-color:red;z-index:-1"><div id="map-div"></div></div>`
map = ixmaps.embed(
"map-div",
{
mapCdn: "https://gjrichter.github.io/ixmaps",
mapService: "leaflet_VT",
mapType: "transparent",
map: "../../maps/svg/maps/generic/equalearth.svg",
width: "1024px",
height: "720px",
scrollsafesilent: "true",
legend: "true",
align: "center",
mode: "info"
},
(map) =>
map
.view([8.792253570362446, 12.304687500000002], 1)
.attribution(attribution)
.require("../../ui/js/tools/tooltip_basic.js")
.options({
scrollSafeSilent: "true",
objectscaling: "dynamic",
normalsizescale: "10000000",
flushChartDraw: "5000",
panhidden: "false"
})
.layer(
ixmaps.layer("World_countries", (layer) =>
layer
.data({
url: "https://raw.githubusercontent.com/gjrichter/geo/main/world/ne_10m_admin_0_countries_s.json",
type: "topojson"
})
.binding({
id: "ISO_A2_EH",
position: "geometry"
})
.type("FEATURES|NOLEGEND")
.style({
colorscheme: ["rgba(0,0,0,0.25)"],
linecolor: "white",
linewidth: "0.3",
showdata: "true"
})
)
)
.layer(
ixmaps.layer("World_countries", (layer) =>
layer
.data({
url: "https://docs.google.com/spreadsheets/d/1OM0Lcnh8GMFTauXFQiYEe9L0Y4mmxPy9/export?format=csv&gid=209278687",
type: "csv"
})
.binding({
value: "sesso",
position: "Codice ISO 3166-1",
title: "nome"
})
.type("CHOROPLETH|CATEGORICAL|COMPACTLEGEND")
.style({
colorscheme: ["rgb(213, 60, 46)", "rgb(56, 141, 192)"],
label: ["ambasciatrici", "ambasciatori"],
opacity: "1",
showdata: "true",
datafields: ["paese", "ambasciata", "NAME_IT"]
})
.meta({
title:
"<b>Ambaciatori e ambasciatrici della Repubblica Italiana, aggiornamento al 12/11/2023</b>"
})
)
)
)
attribution = "dati: <a href='https://docs.google.com/spreadsheets/d/1OM0Lcnh8GMFTauXFQiYEe9L0Y4mmxPy9/edit?pli=1#gid=209278687' target='_blank'>Sesso e Potere</a>, licenza: <a href='https://creativecommons.org/licenses/by/4.0/deed.it target='_blank'>CC-BY-4.0</a>"
ixmaps = require('https://gjrichter.github.io/ixmaps/ui/js/htmlgui_api.js')
Data = require("https://gjrichter.github.io/data.min.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.
