More plantnet bugfixes. But working now

This commit is contained in:
Norbert Schmidt
2023-02-22 09:08:38 +01:00
parent b1c26baea0
commit f90c564a3d
4 changed files with 170 additions and 137 deletions

View File

@@ -8,6 +8,8 @@ const routes: Routes = [
path: '',
component: ClassifyPage
}
];
@NgModule({

View File

@@ -1,6 +1,6 @@
<ion-header>
<ion-toolbar>
<ion-title>Classify your image</ion-title>
<ion-title>Image classification</ion-title>
<ion-buttons slot="start">
<ion-back-button defaultHref="home" icon="chevron-back-outline"></ion-back-button>
</ion-buttons>
@@ -20,36 +20,14 @@
<ion-content>
<ion-item>
<ion-label>Choose a class</ion-label>
Best match:
<ion-select>
<ion-select-option value="leaf">
Leaf
</ion-select-option>
<ion-select-option value="flower">
Flower
</ion-select-option>
<ion-select-option value="fruit">
Fruit
</ion-select-option>
<ion-select-option value="bark">
Bark
</ion-select-option>
<ion-select-option value="auto">
Automatic
</ion-select-option>
</ion-select>
<ion-label>
{{result}}
</ion-label>
</ion-item>
<ion-button expand="block" (click)="submit_image_with_classification()">Submit</ion-button>
</ion-content>

View File

@@ -1,13 +1,17 @@
import { Component, OnInit } from '@angular/core';
import {ENV} from '../../../app.constant';
import { ENV } from '../../../app.constant';
import { TranslateService } from '@ngx-translate/core';
import { AuthService } from '../../../services/auth.service';
import { Auth, user } from '@angular/fire/auth';
import { Storage } from '@ionic/storage-angular';
import { Router } from '@angular/router';
import { Geolocation } from '@capacitor/geolocation';
import { Http } from '@capacitor-community/http';
import * as Parse from 'parse';
// debug purpose: Chrome without CORS on mac
// open /Applications/Google\ Chrome.app --args --user-data-dir="/var/tmp/Chrome dev session" --disable-web-security
@Component({
selector: 'app-classify',
@@ -20,49 +24,149 @@ export class ClassifyPage implements OnInit {
API_PRIVATE_KEY = ENV.plantnetKey; // secret
API_SIMSEARCH_OPTION = '&include-related-images=true'; // optional: get most similar images
API_LANG = '&lang=en'; // default: en
// add result variabel for showing result to user
result = '';
parsefile: any;
parsefileName: any;
parsefileUrl: any;
uploadSuccess = false; // Add this line
image = '';
user = null;
language = '';
latitude: number;
longitude: number;
altitude: number;
constructor(
private storage: Storage,
private authService: AuthService,
private afAuth: Auth,
private translateService: TranslateService,
private router: Router
private storage: Storage,
private authService: AuthService,
private afAuth: Auth,
private translateService: TranslateService,
private router: Router
) { user(this.afAuth).subscribe((response) => {
) {
user(this.afAuth).subscribe((response) => {
//fill the user to verify if someone is logged in
this.user = response;
console.log(this.user.uid);
}); }
});
}
ngOnInit() {
// get location
this.getLocation();
Parse.initialize(ENV.parseAppId, ENV.parseJSKey);
(Parse as any).serverURL = ENV.parseServerUrl; // use your server url
this.storage.create();
// get file out of storage and submit to parse
this.storage.get('plantnet_image').then((val) => { // get image from storage
this.image = val;
this.parsefile = new Parse.File('plantnet_image.jpg', { base64: this.image });
this.parsefile.save().then(
(response: any) => {
this.parsefileUrl = this.parsefile.toJSON().url;
this.parsefileName = this.parsefile.toJSON().name;
console.log('parsefileUrl', this.parsefileUrl);
console.log('parsefileName', this.parsefileName);
// call function to submit to plantnet
this.submit_to_plantnet();
// get image from local storage
this.storage.get('image').then((image) => {
console.log(image);
this.image = image;
}
)
});
// add rose.jpg from assets directory for testing
const imageUri = 'assets/rose.jpg';
};
submit_image_with_classification() {
const plantnet_data_store = Parse.Object.extend('plantnet_data');
// create new instance of parse class
const plantnet_data = new plantnet_data_store();
// set value for parse clas
plantnet_data.set('user_uid', this.user.uid);
plantnet_data.set('name', this.user.displayName);
plantnet_data.set('email', this.user.email);
plantnet_data.set('image', this.parsefile);
plantnet_data.set('classification', this.result);
plantnet_data.set('latitude', this.latitude);
plantnet_data.set('longitude', this.longitude);
plantnet_data.set('altitude', this.altitude);
plantnet_data.save().then(
(result: any) => {
console.log(result);
},
(error: any) => {
console.log(error);
}
);
// go to plantnet page
this.router.navigate(['/plantnet']);
}
async getLocation() {
const position = await Geolocation.getCurrentPosition({
enableHighAccuracy: true,
});
this.latitude = position.coords.latitude;
console.log(position.coords.latitude);
this.longitude = position.coords.longitude;
this.altitude = position.coords.altitude;
return position.coords;
}
submit_to_plantnet() {
const imageUri = this.parsefileUrl;
const imageType = 'image/jpeg';
const imageName = 'rose.jpg';
const imageName = this.parsefileName;
fetch(imageUri)
.then(response => response.blob())
@@ -91,87 +195,31 @@ private router: Router
data: formData
}).then(response => {
console.log(response.data);
// show result on to user
this.result = response.data.results[0].species.scientificName;
console.log(this.result);
}).catch(error => {
console.error(error);
console.log ('error in response', error);
this.result = 'Species not found';
});
})
.catch(error => {
console.error(error);
});
// route to plantnet page
};
savetoParse() {
const plantnet_data_store = Parse.Object.extend('plantnet_data');
// create new instance of parse class
const plantnet_data = new plantnet_data_store();
// set value for parse clas
const file = new Parse.File('plantnet_image.jpg', { base64: this.image });
file.save().then(
(file) => {
console.log(file);
},
(error) => {
console.log(error);
}
);
// add location and clasiification
plantnet_data.set('user_uid', this.user.uid);
plantnet_data.set('name', this.user.displayName);
plantnet_data.set('email', this.user.email);
plantnet_data.set('image', file);
plantnet_data.set('latitude', this.latitude);
plantnet_data.set('longitude', this.longitude);
plantnet_data.set('altitude', this.altitude);
plantnet_data.save().then(
(result: any) => {
console.log(result);
},
(error: any) => {
console.log(error);
}
);
}
async getLocation() {
const position = await Geolocation.getCurrentPosition({
enableHighAccuracy: true,
});
this.latitude = position.coords.latitude;
console.log(position.coords.latitude);
this.longitude = position.coords.longitude;
this.altitude = position.coords.altitude;
return position.coords;
}
}

View File

@@ -11,7 +11,12 @@ const routes: Routes = [
{
path: 'classify',
loadChildren: () => import('./classify/classify.module').then( m => m.ClassifyPageModule)
}
},
{
path: 'plantnet',
loadChildren: () => import('./plantnet.module').then( m => m.PlantnetPageModule)
},
];
@NgModule({