Published
Edited
Aug 3, 2022
Fork of Gap analysis
Insert cell
Insert cell
{
//////////////////////////////////////////////////////////////
//////////////////////// Set-Up //////////////////////////////
//////////////////////////////////////////////////////////////

var margin = { top: 100, right: 100, bottom: 100, left: 100 },
width = Math.min(700, window.innerWidth - 10) - margin.left - margin.right,
height = Math.min(
width,
window.innerHeight - margin.top - margin.bottom - 20
);

//////////////////////////////////////////////////////////////
////////////////////////// Data //////////////////////////////
//////////////////////////////////////////////////////////////

var data = [
[
//Component 1
{ axis: "Identidade (D2)", value: 0.22 },
{ axis: "Dispositivo (D3)", value: 0.28 },
{ axis: "Aplicação (D5)", value: 0.29 },
{ axis: "Governança e dados (D4)", value: 0.17 },
{ axis: "Infra. e redes (D1)", value: 0.22 }
],
[
//Component 2
{ axis: "Identidade (D2)", value: 0.52 },
{ axis: "Dispositivo (D3)", value: 0.48 },
{ axis: "Aplicação (D5)", value: 0.79 },
{ axis: "Governança e dados (D4)", value: 0.19 },
{ axis: "Infra. e redes (D1)", value: 0.32 }
],
[
//Component 3
{ axis: "Identidade (D2)", value: 0.29 },
{ axis: "Dispositivo (D3)", value: 0.68 },
{ axis: "Aplicação (D5)", value: 0.79 },
{ axis: "Governança e dados (D4)", value: 0.87 },
{ axis: "Infra. e redes (D1)", value: 0.12 }
]
];
//////////////////////////////////////////////////////////////
//////////////////// Draw the Chart //////////////////////////
//////////////////////////////////////////////////////////////

var color = d3.scaleOrdinal().range(["#EDC951", "#CC333F", "#00A0B0"]);

var radarChartOptions = {
w: width,
h: height,
margin: margin,
maxValue: 0.5,
levels: 5,
roundStrokes: true,
color: color
};
//Call function to draw the Radar chart
return RadarChart(data, radarChartOptions);
}
Insert cell
Insert cell
Insert cell

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.
Learn more