archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

improve radar sample

Browse Source 
- improve title
- set same size canvas as other samples
- remove user select from canvas
- remove html legend
This commit is contained in:
Ville Hämäläinen 2016-02-28 09:18:56 +02:00
parent aa604af05b
commit 428567d8cf
1 changed files with 10 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
samples/radar.html
View File

@ -5,10 +5,17 @@
<title>Radar Chart</title>
<script src="../dist/Chart.bundle.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style>
canvas {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
</style>
</head>
<body>
<div style="width:100%">
<div style="width:75%">
<canvas id="canvas"></canvas>
</div>
<button id="randomizeData">Randomize Data</button>
@ -16,12 +23,6 @@
<button id="removeDataset">Remove Dataset</button>
<button id="addData">Add Data</button>
<button id="removeData">Remove Data</button>
<div>
<h3>Legend</h3>
<div id="legendContainer">
</div>
</div>
<script>
var randomScalingFactor = function() {
return Math.round(Math.random() * 100);
@ -45,7 +46,7 @@
}, {
label: 'Hidden dataset',
hidden: true,
data: [],
data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()],
}, {
label: "My Second dataset",
backgroundColor: "rgba(151,187,205,0.2)",
@ -61,7 +62,7 @@
},
title: {
display: true,
text: 'Our 3 Favorite Datasets'
text: 'Chart.js Radar Chart'
},
scale: {
reverse: false,
@ -72,15 +73,8 @@
}
};
function updateLegend() {
$legendContainer = $('#legendContainer');
$legendContainer.empty();
$legendContainer.append(window.myRadar.generateLegend());
}
window.onload = function() {
window.myRadar = new Chart(document.getElementById("canvas"), config);
updateLegend();
};
$('#randomizeData').click(function() {
@ -92,7 +86,6 @@
});
window.myRadar.update();
updateLegend();
});
$('#addDataset').click(function() {
@ -112,7 +105,6 @@
config.data.datasets.push(newDataset);
window.myRadar.update();
updateLegend();
});
$('#addData').click(function() {
@ -124,14 +116,12 @@
});
window.myRadar.update();
updateLegend();
}
});
$('#removeDataset').click(function() {
config.data.datasets.splice(0, 1);
window.myRadar.update();
updateLegend();
});
$('#removeData').click(function() {
@ -142,7 +132,6 @@
});
window.myRadar.update();
updateLegend();
});
</script>
</body>