Estou desenvolvendo um aplicativo que consiste de um mapa e uma câmera. No momento, quero adicionar a possibilidade do usuário tirar uma foto com a câmera e marcar no mapa onde essa foto foi tirada, mas estou com dificuldades em armazenar a foto no objeto que guarda as informações dos locais salvos no mapa. Vou colocar uns trechos de código que considero chave:
trecho de addLocation.html:
<label class="item item-input">
<span class="input-label">Name</span>
<input type="text" ng-model="newLocation.name" placeholder="What's Here?" ng-minlength="1" ng-maxlength="100" required>
</label>
<label class="item item-input">
<span class="input-label">Picture</span>
<button class="button icon-left ion-image button-calm" ng-click="selectPhoto()">Select an image</button>
</label>
<div>
<img id="photo" height="256" width="256">
</div>
<div class="item tabs tabs-secondary tabs-icon-left">
<a class="tab-item" href="#">
LAT : {{newLocation.lat | truncate:15}}
</a>
<a class="tab-item" href="#">
LNG : {{newLocation.lng | truncate:15}}
</a>
trecho de app.js : função selectPhoto():
$scope.selectPhoto = function() {
Camera.getPicture({
quality: 75,
destinationType: 1,
sourceType: 0,
correctOrientation: true
}).then(function(imageURI) {
var image = document.getElementById('photo');
image.src = imageURI;
image.style.margin = "0 auto";
image.style.display= "block";
$scope.newLocation.photo = new Image();
$scope.newLocation.photo.src = imageURI;
},function(err) {
console.err(err);
});
}
trecho de mapController.js:
$scope.saveLocation = function() {
LocationsService.savedLocations.push($scope.newLocation);
$scope.modal.hide();
$scope.goTo(LocationsService.savedLocations.length - 1);
};
var location = LocationsService.savedLocations[locationKey];
$scope.map.markers[locationKey] = {
lat:location.lat,
lng:location.lng,
message: location.name + location.photo,
focus: true,
draggable: false
};
Na função selectPhoto(), após selecionar a foto do álbum, a source da variável 'image' tá sendo mudada e no html aparece a imagem selecionada. No entanto, eu não consigo salvar a mesma imagem em newLocation.photo, que fica undefined mesmo depois de selecionar a foto. Creio que o erro esteja em
$scope.newLocation.photo = new Image();
$scope.newLocation.photo.src = imageURI;
do app.js
Creio que não seja algo mto complexo de se resolver e que eu provavelmente estou fazendo alguma bobagem simples, já q sou iniciante em JS, html, etc. Mas realmente espero uma ajuda. Obrigado
var img = new Image();
e depoisimg.src = "suaimagem.jpeg";
de qualquer forma tente alterarimageURI;
paraimage
e veja o que aconteceimage
e trabalhar direto em$scope.newLocation.photo
?