@obliczeniowo/elementary
Version:
Library made in Angular version 19
1 lines • 14 kB
Source Map (JSON)
{"version":3,"file":"obliczeniowo-elementary-simple-diagram2-d.mjs","sources":["../../../../projects/components/simple-diagram2-d/components/simple-diagram2-d/simple-diagram2-d.component.ts","../../../../projects/components/simple-diagram2-d/components/simple-diagram2-d/simple-diagram2-d.component.html","../../../../projects/components/simple-diagram2-d/simple-diagram2-d.module.ts","../../../../projects/components/simple-diagram2-d/obliczeniowo-elementary-simple-diagram2-d.ts"],"sourcesContent":["import { ElementaryMath, MinMax } from '@obliczeniowo/elementary/math';\r\nimport { ChangeDetectionStrategy, Component, ElementRef, Input, OnChanges, Output, SimpleChanges, EventEmitter } from '@angular/core';\r\nimport { GradientDef } from '@obliczeniowo/elementary/svg';\r\nimport { IPoint2D, Point2D } from '@obliczeniowo/elementary/classes';\r\n\r\nexport interface SimpleDiagramHover { converted: Point2D, original: Point2D }\r\n\r\n@Component({\r\n selector: 'obl-simple-diagram2-d',\r\n templateUrl: './simple-diagram2-d.component.html',\r\n styleUrls: ['./simple-diagram2-d.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: false\r\n})\r\nexport class SimpleDiagram2DComponent implements OnChanges {\r\n svg!: SVGSVGElement;\r\n\r\n /**\r\n * Points2D array table as diagram points\r\n */\r\n @Input() points: Point2D[] = [];\r\n /**\r\n * Gradient definition description including:\r\n * array of:\r\n * - colors;\r\n * - opacity;\r\n * - offset;\r\n * coordinates of gradient:\r\n * - x, y start/end position (optional)\r\n */\r\n @Input() gradient: GradientDef | undefined;\r\n /**\r\n * When undefined or not set it will 1 on X is 100% object width, and similar on Y\r\n * When 'userSpaceOnUse' it use space units system (not related to object size)\r\n */\r\n @Input() gradientUnits: 'userSpaceOnUse' | undefined;\r\n /**\r\n * diagram padding\r\n */\r\n @Input() padding = 0;\r\n /**\r\n * bottom diagram padding (includes as part of diagram shape)\r\n */\r\n @Input() diagramBottomPadding = 5;\r\n /** */\r\n @Input() height = 50;\r\n /** */\r\n @Input() width = 200;\r\n /**\r\n * When set to true emit cursor position value in diagram space coordinates\r\n */\r\n @Input() interactive: boolean = false;\r\n /**\r\n * Emit when require recalculation\r\n */\r\n @Output() recalculate: EventEmitter<{ component: SimpleDiagram2DComponent }> =\r\n new EventEmitter<{ component: SimpleDiagram2DComponent }>();\r\n\r\n @Output() hover = new EventEmitter<SimpleDiagramHover>();\r\n\r\n protected convertedShape = '';\r\n protected convertedLines = '';\r\n\r\n protected gradientId = `SimpleDiagram2D-${Math.floor(Math.random() * 100000)}`;\r\n\r\n protected xMinMax!: MinMax;\r\n protected yMinMax!: MinMax;\r\n protected dx!: number;\r\n protected dy!: number;\r\n protected sx!: number;\r\n protected sy!: number;\r\n\r\n constructor(protected element: ElementRef<HTMLElement>) { }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes.points) {\r\n this.convert();\r\n }\r\n if (changes.width || changes.height) {\r\n this.convert();\r\n }\r\n }\r\n\r\n transform(p: Point2D): Point2D {\r\n const dHeight = (this.height - this.diagramBottomPadding);\r\n return new Point2D((p.x - this.xMinMax.min) * this.sx * (this.width - 2 * this.padding) / this.width + this.padding,\r\n (dHeight - (p.y - this.yMinMax.min) * this.sy) * (this.height - 2 * this.padding) / this.height + this.padding);\r\n }\r\n\r\n mouseToDiagram(p: IPoint2D): Point2D {\r\n const width = +this.width;\r\n const height = +this.height;\r\n const dHeight = height - +this.diagramBottomPadding;\r\n const padding = +this.padding;\r\n\r\n return new Point2D((((p.x - padding) / this.sx) * width) / (width - padding * 2) + this.xMinMax.min, (dHeight - p.y + padding) / this.sy + this.yMinMax.min);\r\n }\r\n\r\n interpolate(x: number): number {\r\n if (x < this.xMinMax.min && x > this.xMinMax.max) {\r\n return NaN;\r\n }\r\n const index = this.points.findIndex(pt => pt.x >= x) - 1;\r\n\r\n if (index === -1) {\r\n return this.points[0].y;\r\n }\r\n\r\n const fp = this.points[index];\r\n const sp = this.points[index + 1];\r\n\r\n const a = (sp.y - fp.y) / (sp.x - fp.x);\r\n const b = fp.y - a * fp.x;\r\n\r\n return a * x + b;\r\n }\r\n\r\n protected mouseMove(event: MouseEvent) {\r\n if (this.interactive && !this.points) {\r\n return;\r\n }\r\n\r\n const element = this.element.nativeElement;\r\n const mousePos = { x: event.x - element.offsetLeft, y: event.y - element.offsetTop };\r\n const converted = this.mouseToDiagram(mousePos);\r\n\r\n const original = this.points.reduce((p, c) => {\r\n p = (p && Math.abs(p.x - converted.x) < Math.abs(c.x - converted.x) && p) || c;\r\n return p;\r\n })\r\n\r\n const hovered = this.transform(original);\r\n\r\n this.hover.emit({ converted: hovered, original });\r\n }\r\n\r\n protected convert(): void {\r\n this.xMinMax = ElementaryMath.getMinMax(this.points.map(p => p.x));\r\n this.yMinMax = ElementaryMath.getMinMax(this.points.map(p => p.y));\r\n\r\n this.dx = (this.xMinMax.max - this.xMinMax.min) || 1;\r\n this.dy = (this.yMinMax.max - this.yMinMax.min) || 1;\r\n\r\n const dHeight = (this.height - this.diagramBottomPadding);\r\n\r\n this.sx = this.width / this.dx;\r\n this.sy = dHeight / this.dy;\r\n\r\n const points = this.points.map(p => new Point2D((p.x - this.xMinMax.min) * this.sx, dHeight - (p.y - this.yMinMax.min) * this.sy));\r\n\r\n this.convertedLines = 'M' + points.map(p => p.toString(' ')).join('');\r\n this.convertedShape = points.concat([\r\n new Point2D((this.xMinMax.max - this.xMinMax.min) * this.sx, (this.yMinMax.max - this.yMinMax.min) * this.sy +\r\n this.diagramBottomPadding),\r\n new Point2D(0, (this.yMinMax.max - this.yMinMax.min) * this.sy + this.diagramBottomPadding)]).map(p => p.toString()).join('');\r\n\r\n this.recalculate.emit({ component: this });\r\n }\r\n}\r\n","<svg width=\"100%\" [attr.viewBox]=\"'0 0 ' + this.width + ' ' + this.height\" (mousemove)=\"mouseMove($event)\">\r\n <defs>\r\n @if (gradient) {\r\n <g\r\n obl-svg-linear-gradient\r\n [gradient]=\"gradient\"\r\n [name]=\"gradientId\"\r\n [gradientUnits]=\"gradientUnits\"\r\n ></g>\r\n }\r\n </defs>\r\n <g\r\n [attr.transform]=\"\r\n 'translate(' +\r\n padding +\r\n ',' +\r\n padding +\r\n ') scale(' +\r\n (width - padding * 2) / width +\r\n ', ' +\r\n (height - padding * 2) / height +\r\n ')'\r\n \"\r\n >\r\n <polygon\r\n [attr.points]=\"convertedShape\"\r\n [style.fill]=\"gradient ? 'URL(#' + gradientId + ')' : undefined\"\r\n ></polygon>\r\n <path [attr.d]=\"convertedLines\"></path>\r\n </g>\r\n <ng-content></ng-content>\r\n</svg>\r\n","import { SvgModule } from '@obliczeniowo/elementary/svg';\r\nimport { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SimpleDiagram2DComponent } from './components/simple-diagram2-d/simple-diagram2-d.component';\r\n\r\n@NgModule({\r\n declarations: [\r\n SimpleDiagram2DComponent\r\n ],\r\n imports: [\r\n CommonModule,\r\n SvgModule\r\n ],\r\n exports: [\r\n SimpleDiagram2DComponent\r\n ]\r\n})\r\nexport class SimpleDiagram2DModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}