Published
Edited
Aug 4, 2021
1 fork
2 stars
md`# Decision Tree Feature Importance for different datasets`
viewof datasetChoice = DOM.select(["Radiflow Top Features", "SWaT Top Features"]);
{
html`
<div class="radarChart"></div>
`
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);
var data = [
[//Radiflow
{axis:"Sport", value:0.27813574946815384},
{axis:"Offset", value:0.1167100927650959},
{axis:"Dport", value:0.10695716270735386},
{axis:"Load", value:0.07607657654111369},
{axis:"dMeanPktSz", value:0.04823161669471266},
{axis:"SrcRate", value:0.03823630966043452},
{axis:"DstLoad", value:0.03519039632393581},
{axis:"DstLoss", value:0.03246590399849453},
],[//SWaT
{axis:"Sport", value:0.007582057324559283},
{axis:"Offset", value:0.2909480230037176},
{axis:"Dport", value:0.2649606553593602},
{axis:"Load", value:0.001366700146850108},
{axis:"dMeanPktSz", value:0.0021575990066845232},
{axis:"SrcRate", value:0.0016694938586392285},
{axis:"DstLoad", value:0.005230903876123564},
{axis:"DstLoss", value:0.00015903010071989884},
]
];
var data2 = [
[//Radiflow
{axis:"Offset", value:0.1167100927650959},
{axis:"Dport", value:0.10695716270735386},
{axis:"Flg-e", value:0.00018341728093252993},
{axis:"Flg-*", value:0.0001796901181291664},
{axis:"Sport", value:0.27813574946815384},
{axis:"DstLoad", value:0.03519039632393581},
{axis:"dMeanPktSz", value:0.04823161669471266},
{axis:"SrcRate", value:0.03823630966043452},
],
[//SWaT
{axis:"Offset", value:0.2909480230037176},
{axis:"Dport", value:0.2649606553593602},
{axis:"Flg-e", value:0.21120127171197364},
{axis:"Flg-*", value:0.19495502004182186},
{axis:"Sport", value:0.007582057324559283},
{axis:"DstLoad", value:0.005230903876123564},
{axis:"dMeanPktSz", value:0.0021575990066845232},
{axis:"SrcRate", value:0.0016694938586392285},
]
];
var color = d3.scaleOrdinal()
.range(["#EDC951","#CC333F"]);
var radarChartOptions = {
w: width,
h: height,
margin: margin,
maxValue: 0.4,
levels: 4,
roundStrokes: true,
color: color,
labelFactor: 1.1
};
if (datasetChoice === "Radiflow Top Features") {
//Call function to draw the Radar chart
return RadarChart(".radarChart", data, radarChartOptions);
}
else {
return RadarChart(".radarChart", data2, radarChartOptions);
}
}
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.
