GradRect.ts 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import { SGraphItem } from "@persagy-web/graph/lib";
  2. import { SColor, SLinearGradient, SPainter, SRadialGradient, SRect } from "@persagy-web/draw/lib";
  3. /**
  4. * 渐变
  5. *
  6. * @author 郝洁 <haojie@persagy.com>
  7. */
  8. export class GradRect extends SGraphItem {
  9. /** X 坐标最小值 */
  10. minX = 0;
  11. /** Y 坐标最小值 */
  12. minY = 0;
  13. /** Y 坐标最大值 */
  14. maxY = 1000;
  15. /** X 坐标最大值 */
  16. maxX = 1000;
  17. /** 实例化 */
  18. gradient: SRadialGradient | SLinearGradient | null = null;
  19. /**
  20. * 构造函数
  21. *
  22. * @param parent Item 图像引擎
  23. * @param grad 渐变类
  24. */
  25. constructor(parent: SGraphItem | null, grad: SRadialGradient | SLinearGradient) {
  26. super(parent);
  27. this.gradient = grad;
  28. this.gradient.addColorStop(0, new SColor('#ff483b'));
  29. this.gradient.addColorStop(0.5, new SColor('#04ff00'));
  30. this.gradient.addColorStop(1, new SColor('#3d4eff'));
  31. }
  32. /**
  33. * 矩形数据类型绘制
  34. *
  35. * @return 边界区域
  36. */
  37. boundingRect() {
  38. return new SRect(
  39. this.minX,
  40. this.minY,
  41. this.maxX - this.minX,
  42. this.maxY - this.minY
  43. );
  44. }
  45. /**
  46. * Item 绘制操作
  47. * @param painter 绘制对象
  48. */
  49. onDraw(painter: SPainter) {
  50. painter.pen.color = SColor.Black;
  51. painter.brush.gradient = this.gradient;
  52. painter.drawRect(0, 0, 1000, 1000);
  53. if (this.gradient instanceof SRadialGradient) { //实例在 SRadialGradient 构造函数中
  54. painter.brush.color = SColor.Transparent;
  55. painter.drawCircle(this.gradient.x1, this.gradient.y1, this.gradient.r1);
  56. painter.drawCircle(this.gradient.x2, this.gradient.y2, this.gradient.r2);
  57. }
  58. }
  59. }