JSFiddle - React, Tailwind, and code Playground
HTML
<div id="test"></div>
JavaScript
require([
'dojox/charting/Chart2D',
'dojox/charting/axis2d/Default',
'dojox/charting/plot2d/Default',
'dojox/charting/plot2d/Spider',
'dojox/charting/axis2d/Base',
'dojo/domReady!'
], function (Chart) {
var chart = new Chart("test");
chart.addPlot("default", {
type: "Spider",
labelOffset: -10,
seriesFillAlpha: 0.2,
markerSize: 3,
precision: 0,
spiderType: "polygon"
});
var data = [{
"CPU Utilization": 1,
"NetworkIn": 444,
"DiskReadBytes": 1.00002,
"NetworkOut": 360.00001,
"DiskWriteBytes": 1.00002
}, {
"CPU Utilization": 1.0001,
"NetworkIn": 444,
"DiskReadBytes": 1.0002,
"NetworkOut": 360.00001,
"DiskWriteBytes": 1
}, {
"CPU Utilization": 1,
"NetworkIn": 486.00002,
"DiskReadBytes": 1.00001,
"NetworkOut": 360.00001,
"DiskWriteBytes": 1
}];
chart.addSeries("min", {
data: data[0]
}, {
fill: "blue"
});
chart.addSeries("max", {
data: data[1]
}, {
fill: "blue"
});
chart.addSeries("USA", {
data: data[2]
}, {
fill: "blue"
});
chart.render();
chart.removeSeries("min");
chart.removeSeries("max");
});