heatmap.js 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. var __rest = (this && this.__rest) || function (s, e) {
  2. var t = {};
  3. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
  4. t[p] = s[p];
  5. if (s != null && typeof Object.getOwnPropertySymbols === "function")
  6. for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  7. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
  8. t[p[i]] = s[p[i]];
  9. }
  10. return t;
  11. };
  12. import { max as d3max, min as d3min } from 'd3-array';
  13. import { Image as GImage } from '@antv/g';
  14. import { applyStyle, getShapeTheme } from '../utils';
  15. import { select } from '../../utils/selection';
  16. import { HeatmapRenderer } from './renderer';
  17. function deleteKey(obj, fn) {
  18. const r = Object.assign({}, obj);
  19. return Object.keys(obj).reduce((r, k) => {
  20. const v = obj[k];
  21. if (!fn(v, k))
  22. r[k] = v;
  23. return r;
  24. }, {});
  25. }
  26. export const Heatmap = (options) => {
  27. const { gradient, opacity, maxOpacity, minOpacity, blur, useGradientOpacity } = options, style = __rest(options, ["gradient", "opacity", "maxOpacity", "minOpacity", "blur", "useGradientOpacity"]);
  28. return (points, value, coordinate, theme, _, context) => {
  29. const { mark, shape, defaultShape, transform } = value;
  30. const shapeTheme = __rest(getShapeTheme(theme, mark, shape, defaultShape), []);
  31. const { createCanvas } = context;
  32. const [width, height] = coordinate.getSize();
  33. const data = points.map((p) => ({
  34. x: p[0],
  35. y: p[1],
  36. value: p[2],
  37. radius: p[3],
  38. }));
  39. const min = d3min(points, (p) => p[2]);
  40. const max = d3max(points, (p) => p[2]);
  41. const options = {
  42. gradient,
  43. opacity,
  44. minOpacity,
  45. maxOpacity,
  46. blur,
  47. useGradientOpacity,
  48. };
  49. const ctx = width && height
  50. ? HeatmapRenderer(width, height, min, max, data, deleteKey(options, (v) => v === undefined), createCanvas)
  51. : { canvas: null };
  52. return select(new GImage())
  53. .call(applyStyle, shapeTheme)
  54. .style('x', 0)
  55. .style('y', 0)
  56. .style('width', width)
  57. .style('height', height)
  58. .style('src', ctx.canvas)
  59. .style('transform', transform)
  60. .call(applyStyle, style)
  61. .node();
  62. };
  63. };
  64. Heatmap.props = {
  65. defaultMarker: 'point',
  66. defaultEnterAnimation: 'fadeIn',
  67. defaultUpdateAnimation: 'morphing',
  68. defaultExitAnimation: 'fadeOut',
  69. };
  70. //# sourceMappingURL=heatmap.js.map