| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- var utils = Samples.utils;
- // CSP: disable automatic style injection
- Chart.platform.disableCSSInjection = true;
- utils.srand(110);
- function generateData() {
- var DATA_COUNT = 16;
- var MIN_XY = -150;
- var MAX_XY = 100;
- var data = [];
- var i;
- for (i = 0; i < DATA_COUNT; ++i) {
- data.push({
- x: utils.rand(MIN_XY, MAX_XY),
- y: utils.rand(MIN_XY, MAX_XY),
- v: utils.rand(0, 1000)
- });
- }
- return data;
- }
- window.addEventListener('load', function() {
- new Chart('chart-0', {
- type: 'bubble',
- data: {
- datasets: [{
- backgroundColor: utils.color(0),
- data: generateData()
- }, {
- backgroundColor: utils.color(1),
- data: generateData()
- }]
- },
- options: {
- aspectRatio: 1,
- legend: false,
- tooltip: false,
- elements: {
- point: {
- radius: function(context) {
- var value = context.dataset.data[context.dataIndex];
- var size = context.chart.width;
- var base = Math.abs(value.v) / 1000;
- return (size / 24) * base;
- }
- }
- }
- }
- });
- });
|