You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ze...@apache.org on 2020/10/30 23:23:38 UTC
[incubator-streampipes] branch STREAMPIPES-234 updated: Image
labeling works now with new label model
This is an automated email from the ASF dual-hosted git repository.
zehnder pushed a commit to branch STREAMPIPES-234
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
The following commit(s) were added to refs/heads/STREAMPIPES-234 by this push:
new 0cf97fd Image labeling works now with new label model
0cf97fd is described below
commit 0cf97fd273e4c302b8d1c60335d021b4d04b8813
Author: Philipp Zehnder <ze...@fzi.de>
AuthorDate: Sat Oct 31 00:23:13 2020 +0100
Image labeling works now with new label model
---
ui/package.json | 34 +++++++++++-----------
ui/src/app/core-model/coco/Annotation.ts | 1 +
ui/src/app/core-model/coco/Category.ts | 10 ++++---
.../image-annotations.component.html | 15 +---------
.../image-annotations.component.ts | 8 ++---
.../image-labeling/image-labeling.component.ts | 7 ++---
.../core-ui/image/services/CocoFormat.service.ts | 21 ++++++-------
7 files changed, 43 insertions(+), 53 deletions(-)
diff --git a/ui/package.json b/ui/package.json
index 8a7843f..054ee03 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -50,8 +50,8 @@
"codemirror": "5.55.0",
"core-js": "2.5.3",
"dagre": "0.8.4",
- "datatables.net-dt": "1.10.21",
"datatables.net": "1.10.20",
+ "datatables.net-dt": "1.10.21",
"fast-json-patch": "2.1.0",
"file-saver": "1.3.8",
"jquery": "2.1.3",
@@ -67,12 +67,12 @@
"ng-file-upload": "9.0.13",
"ng-pick-datetime": "7.0.0",
"ng-prettyjson": "0.1.8",
- "ngx-showdown": "5.1.0",
"ng-simple-slideshow": "1.2.9",
"ng2-dragula": "1.5.0",
"ngx-auto-scroll": "^1.1.0",
"ngx-color-picker": "9.0.0",
"ngx-quill": "12.0.1",
+ "ngx-showdown": "5.1.0",
"plotly.js": "1.52.2",
"prismjs": "1.16.0",
"quill": "1.3.7",
@@ -81,31 +81,31 @@
"shepherd.js": "2.4.0",
"showdown": "1.9.1",
"systemjs": "0.21.6",
- "tslib": "^2.0.0",
+ "tslib": "^2.0.3",
"zone.js": "0.10.3"
},
"devDependencies": {
"@angular-builders/custom-webpack": "10.0.0",
- "@angular-devkit/build-angular": "~0.1000.6",
+ "@angular-devkit/build-angular": "^0.1000.8",
"@angular/cli": "10.0.6",
"@angular/compiler-cli": "10.0.9",
- "@ngtools/webpack": "^10.0.7",
- "@types/angular": "^1.6.43",
- "@types/jasmine": "~2.8.3",
- "@types/jqueryui": "^1.12.7",
- "@types/leaflet": "^1.5.9",
- "@types/node": "^12.11.1",
- "@types/rx": "^4.1.1",
+ "@ngtools/webpack": "^10.2.0",
+ "@types/angular": "^1.7.4",
+ "@types/jasmine": "^2.8.17",
+ "@types/jqueryui": "^1.12.13",
+ "@types/leaflet": "^1.5.19",
+ "@types/node": "^12.19.3",
+ "@types/rx": "^4.1.2",
"@types/showdown": "1.9.3",
- "codelyzer": "^6.0.0",
- "copy-webpack-plugin": "^5.0.2",
+ "codelyzer": "^6.0.1",
"compression-webpack-plugin": "^3.0.0",
+ "copy-webpack-plugin": "^5.1.2",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.6",
"html-webpack-plugin": "^3.2.0",
"jasmine-core": "~3.5.0",
- "js-yaml": "^3.10.0",
+ "js-yaml": "^3.14.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
@@ -115,7 +115,7 @@
"karma-verbose-reporter": "0.0.6",
"mini-css-extract-plugin": "^0.9.0",
"mustache": "^2.3.0",
- "node-sass": "^4.13.1",
+ "node-sass": "^4.14.1",
"prettier": "1.14.2",
"raw-loader": "^0.5.1",
"sass-loader": "^6.0.7",
@@ -126,9 +126,9 @@
"typescript": "3.9.7",
"uglifyjs-webpack-plugin": "2.2.0",
"webpack": "4.44.1",
+ "webpack-bundle-analyzer": "^3.9.0",
"webpack-cli": "3.3.12",
"webpack-dev-server": "3.11.0",
- "webpack-merge": "^4.2.1",
- "webpack-bundle-analyzer": "^3.8.0"
+ "webpack-merge": "^4.2.1"
}
}
diff --git a/ui/src/app/core-model/coco/Annotation.ts b/ui/src/app/core-model/coco/Annotation.ts
index b8bdd40..9a3d779 100644
--- a/ui/src/app/core-model/coco/Annotation.ts
+++ b/ui/src/app/core-model/coco/Annotation.ts
@@ -32,6 +32,7 @@ export class Annotation {
isHovered = false;
category_name: string;
color: string;
+ label_name: string;
constructor() {
this.segmentation = undefined;
diff --git a/ui/src/app/core-model/coco/Category.ts b/ui/src/app/core-model/coco/Category.ts
index be5001f..43ee600 100644
--- a/ui/src/app/core-model/coco/Category.ts
+++ b/ui/src/app/core-model/coco/Category.ts
@@ -19,13 +19,15 @@
export class Category {
- constructor(id: number, name: String, supercategory: String) {
+ constructor(id: number, name: string, supercategory: string, label_name: string) {
this.id = id;
this.name = name;
this.supercategory = supercategory;
+ this.label_name = label_name;
}
id: number;
- name: String;
- supercategory: String;
-}
\ No newline at end of file
+ name: string;
+ supercategory: string;
+ label_name: string;
+}
diff --git a/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.html b/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.html
index f60a0e6..f8b3a0d 100644
--- a/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.html
+++ b/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.html
@@ -22,23 +22,10 @@
<mat-list-item *ngFor="let annotation of annotations" (mouseover)="enterAnnotation(annotation)" (mouseout)="leaveAnnotation(annotation)"
style="height: 40px; padding-top: 5px; padding-buttom: 5px; border-radius: 50px; margin-bottom: 5px"
[style.background-color]="annotation.isHovered || annotation.isSelected ? 'lightgrey' : 'white'">
- <mat-form-field>
-<!-- <mat-select [value]="annotation.category_name">-->
- <mat-select >
- <mat-select-trigger>
<mat-icon [style.color]="annotation.color">color_lens</mat-icon>
- {{annotation.category_name}}
- </mat-select-trigger>
+ {{annotation.label_name}}
-<!-- <mat-optgroup *ngFor="let category of categories" [label]="category">-->
- <mat-option *ngFor="let label of labels" [value]="label" (click)="changeLabel(annotation, label)">
- <mat-icon [style.color]="label.color">color_lens</mat-icon>
- {{label.name}}
- </mat-option>
-<!-- </mat-optgroup>-->
- </mat-select>
- </mat-form-field>
<button mat-icon-button (click)="delete(annotation)" style="margin-top: -10px; margin-left: -5px"> <mat-icon>delete_forever</mat-icon></button>
</mat-list-item>
</mat-list>
diff --git a/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.ts b/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.ts
index c86c322..5c81965 100644
--- a/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.ts
+++ b/ui/src/app/core-ui/image/components/image-annotations/image-annotations.component.ts
@@ -18,7 +18,6 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Annotation } from '../../../../core-model/coco/Annotation';
-import { ColorService } from '../../services/color.service';
import { Label } from '../../../../core-model/gen/streampipes-model';
@Component({
@@ -36,13 +35,13 @@ export class ImageAnnotationsComponent implements OnInit {
@Output() changeAnnotationLabel: EventEmitter<[Annotation, Label]> = new EventEmitter<[Annotation, Label]>();
@Output() deleteAnnotation: EventEmitter<Annotation> = new EventEmitter<Annotation>();
- constructor() { }
+ constructor() {}
ngOnInit(): void {
}
- changeLabel(annotation, label) {
- this.changeAnnotationLabel.emit([annotation, label]);
+ changeLabel(change: [Annotation, Label]) {
+ this.changeAnnotationLabel.emit([change[0], change[1]]);
}
delete(annotation) {
@@ -57,4 +56,5 @@ export class ImageAnnotationsComponent implements OnInit {
annotation.isHovered = false;
}
+
}
diff --git a/ui/src/app/core-ui/image/image-labeling/image-labeling.component.ts b/ui/src/app/core-ui/image/image-labeling/image-labeling.component.ts
index 0f16c77..5e47381 100644
--- a/ui/src/app/core-ui/image/image-labeling/image-labeling.component.ts
+++ b/ui/src/app/core-ui/image/image-labeling/image-labeling.component.ts
@@ -33,7 +33,6 @@ import { PolygonLabelingService } from '../services/PolygonLabeling.service';
import { ReactLabelingService } from '../services/ReactLabeling.service';
import { Label } from '../../../core-model/gen/streampipes-model';
import { LabelService } from '../../labels/services/label.service';
-import { unwrapConstructorDependencies } from '@angular/compiler-cli/src/ngtsc/annotations/src/util';
@Component({
selector: 'sp-image-labeling',
@@ -145,7 +144,7 @@ export class ImageLabelingComponent implements OnInit {
if (result !== undefined) {
const coco = this.cocoFile;
const annotation = this.cocoFormatService.addReactAnnotationToFirstImage(coco, result[0], result[1],
- this.selectedLabel.categoryId, this.selectedLabel.name, this.selectedLabel.color);
+ this.selectedLabel.categoryId, this.selectedLabel._id, this.selectedLabel.color, this.selectedLabel.name);
this.reactLabelingService.draw(annotationLayer, shift, annotation, this.imageView, this.selectedLabel.color);
}
}
@@ -158,7 +157,7 @@ export class ImageLabelingComponent implements OnInit {
const result = this.brushLabelingService.endLabeling(position);
const coco = this.cocoFile;
const annotation = this.cocoFormatService.addBrushAnnotationFirstImage(coco, result[0], result[1],
- this.selectedLabel.categoryId, this.selectedLabel.name);
+ this.selectedLabel.categoryId, this.selectedLabel.name, this.selectedLabel.name);
this.brushLabelingService.draw(annotationLayer, shift, annotation, this.imageView);
}
}
@@ -224,7 +223,7 @@ export class ImageLabelingComponent implements OnInit {
handleChangeAnnotationLabel(change: [Annotation, Label]) {
if (!this.isDrawing) {
const coco = this.cocoFile;
- const categoryId = this.cocoFormatService.getLabelId(coco, change[0].category_id, change[1].name);
+ const categoryId = this.cocoFormatService.getLabelId(coco, change[0].category_id, change[1].name, change[1].name);
change[0].category_id = categoryId;
change[0].category_name = change[1].categoryId;
this.imageView.redrawAll();
diff --git a/ui/src/app/core-ui/image/services/CocoFormat.service.ts b/ui/src/app/core-ui/image/services/CocoFormat.service.ts
index 42f6f50..28b8e00 100644
--- a/ui/src/app/core-ui/image/services/CocoFormat.service.ts
+++ b/ui/src/app/core-ui/image/services/CocoFormat.service.ts
@@ -24,11 +24,11 @@ import { Image } from '../../../core-model/coco/Image';
@Injectable()
export class CocoFormatService {
- static getLabelId(coco: CocoFormat, supercategory, name): number {
+ static getLabelId(coco: CocoFormat, supercategory, name, labelName): number {
// TODO: Find better solution instead of copy same code
let category = coco.categories.find(elem => elem.name === name && elem.supercategory === supercategory);
if (category === undefined) {
- category = new Category(coco.categories.length + 1, name, supercategory);
+ category = new Category(coco.categories.length + 1, name, supercategory, labelName);
coco.categories.push(category);
}
return category.id;
@@ -46,49 +46,50 @@ export class CocoFormatService {
return coco.categories.find(elem => elem.id === id).name;
}
- getLabelId(coco: CocoFormat, supercategory, name): number {
+ getLabelId(coco: CocoFormat, supercategory, name, labelName): number {
let category = coco.categories.find(elem => elem.name === name && elem.supercategory === supercategory);
if (category === undefined) {
- category = new Category(coco.categories.length + 1, name, supercategory);
+ category = new Category(coco.categories.length + 1, name, supercategory, labelName);
coco.categories.push(category);
}
return category.id;
}
- addReactAnnotationToFirstImage(coco: CocoFormat, cords, size, supercategory, category, color): Annotation {
+ addReactAnnotationToFirstImage(coco: CocoFormat, cords, size, supercategory, category, color, labelName): Annotation {
const annotation = new Annotation();
annotation.id = coco.annotations.length + 1;
annotation.iscrowd = 0;
annotation.image_id = 1;
annotation.bbox = [cords.x, cords.y, size.x, size.y];
annotation.area = size.x * size.y
- annotation.category_id = CocoFormatService.getLabelId(coco, supercategory, category);
+ annotation.category_id = CocoFormatService.getLabelId(coco, supercategory, category, labelName);
annotation.category_name = category;
annotation.color = color;
+ annotation.label_name = labelName;
coco.annotations.push(annotation);
return annotation;
}
- addPolygonAnnotationFirstImage(coco: CocoFormat, points, supercategory, category): Annotation {
+ addPolygonAnnotationFirstImage(coco: CocoFormat, points, supercategory, category, labelName): Annotation {
const annotation = new Annotation();
annotation.id = coco.annotations.length + 1;
annotation.iscrowd = 0;
annotation.image_id = 1;
annotation.segmentation = [points];
- annotation.category_id = CocoFormatService.getLabelId(coco, supercategory, category);
+ annotation.category_id = CocoFormatService.getLabelId(coco, supercategory, category, labelName);
annotation.category_name = category;
coco.annotations.push(annotation);
return annotation;
}
- addBrushAnnotationFirstImage(coco: CocoFormat, points, brushSize, supercategory, category): Annotation {
+ addBrushAnnotationFirstImage(coco: CocoFormat, points, brushSize, supercategory, category, labelName): Annotation {
const annotation = new Annotation();
annotation.id = coco.annotations.length + 1;
annotation.iscrowd = 0;
annotation.image_id = 1;
annotation.segmentation = [points];
annotation.brushSize = brushSize;
- annotation.category_id = this.getLabelId(coco, supercategory, category);
+ annotation.category_id = this.getLabelId(coco, supercategory, category, labelName);
annotation.category_name = category;
coco.annotations.push(annotation);
return annotation;