opacity-scriptable.js 852 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. export default {
  2. config: {
  3. type: 'line',
  4. data: {
  5. labels: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
  6. datasets: [{
  7. data: [0, 100, 10, 90, 20, 80, 30, 70, 40, 60, 50],
  8. datalabels: {
  9. backgroundColor: '#00ff77'
  10. }
  11. }]
  12. },
  13. options: {
  14. layout: {
  15. padding: 24
  16. },
  17. elements: {
  18. line: {
  19. backgroundColor: 'transparent',
  20. borderColor: 'transparent'
  21. }
  22. },
  23. plugins: {
  24. datalabels: {
  25. backgroundColor: '#00ff77',
  26. borderColor: '#0000ff',
  27. borderWidth: 4,
  28. color: '#0000ff',
  29. font: {
  30. size: 0
  31. },
  32. opacity: function(context) {
  33. var data = context.dataset.data[context.dataIndex];
  34. return data / 100;
  35. },
  36. padding: 8,
  37. formatter: function() {
  38. return '\u25AE';
  39. }
  40. }
  41. }
  42. }
  43. },
  44. options: {
  45. canvas: {
  46. height: 64,
  47. width: 512
  48. }
  49. }
  50. };