0

Olá, tenho uma função que captura coordenadas de elementos que eu movo na tela com o mouse. Porém essa minha função, pega o rastro das coordenadas dos elementos que eu arrasto, eu gostaria de pegar apenas a última coordenada de cada um, para salvar no banco. Como eu poderia tratar o array, de forma que eu pegue apenas a última coordenada em relação ao id?

Função que pega as coordenadas:

 moveElem(elemID) {
    let self = this;
    function parseNumber(num) {
     return parseFloat(num.replace(/[^\d]/)) || 0;
  }

    let moveElemento = (function () {

    let coords = [];
    let startX;
    let startY;

    let currentElemento = null;
    let currentWidth = 0;
    let currentHeight = 0;
    let currentLeft = 0;
    let currentTop = 0;
    let callMoveOnElemento = null;
    let callMoveStopElemento = null;

    let contentMove = '.circle' + elemID;
    let move = false;

    let marginStop = 30;
    let maxWidth = window.innerWidth - marginStop;
    let maxHeight = window.innerHeight - marginStop;

  $(contentMove).on('mousedown', function (e) {
    currentElemento = this.parentNode;       
    currentLeft = parseNumber(currentElemento.style.left);
    currentTop = parseNumber(currentElemento.style.top);

    startX = e.clientX;
    startY = e.clientY;
    if (typeof (callMoveOnElemento) == 'function')
      callMoveOnElemento(currentElemento);
    move = true;
  });

  $(document).on('mouseup', function () {
    if (currentElemento == null) return;
    if (typeof (callMoveStopElemento) == 'function')
      callMoveStopElemento(currentElemento);
    currentElemento = null;
    move = false;
  })

  $(document).on('mousemove', function (e) {
    if (move == true) {
      let newX = currentLeft + e.clientX - startX;
      let newY = currentTop + e.clientY - startY;

      if (marginStop > e.clientX) return;
      if (marginStop > e.clientY) return;
      if (maxWidth < e.clientX) return;
      if (maxHeight < e.clientY) return;

      $(currentElemento).css({
        'left': newX,
        'top': newY
      });

      coords = [{ "id": elemID, "latitude": newY, "longitude": newX }];
      self.trabalharRespostaFuncao(coords);
    }
  });

  return function (func1, func2) {
    callMoveOnElemento = func1;
    callMoveStopElemento = func2;
  }
})();
}

Função para preparar para encher o array de coordenadas

private trabalharRespostaFuncao(coords) {
  for (var coord of coords) {
    this.popularListaCoordenadas(coord);
  }
}

Função para alimentar o array de coordenadas

private popularListaCoordenadas(coord) {
    this.coordenadas.push({
    id: coord.id, latitude: coord.latitude, longitude: coord.longitude
    });

}

Fico aberto a sugestões, agradeço desde já.

4
  • A ultima coordenada é sempre a que tem o id maior ?
    – Isac
    16/01/2018 às 12:25
  • Não, cada elemento tem um id diferente. Preciso pegar apenas a última coordenada x, y de cada um desses id. 16/01/2018 às 12:27
  • Porque não modificar o método popularListaCoordenadas para utilizar um outro dicionario apenas com as ultimas coordenadas de cada id ?
    – Isac
    16/01/2018 às 12:57
  • Pode ser, mas como fazer isso? Eu ainda não consegui extrair as últimas coordenadas de cada id isoladamente. 16/01/2018 às 13:01

5 Respostas 5

1

em JS, o último elemento de qualquer array pode ser obtido assim:

ultimoElemento = qualquerArray[qualquerArray.length-1];
2
  • Bom, eu já tentei dessa forma, porém ele pega apenas a última posição do array geral. Eu gostaria que ele pegasse a última posição, em que por exemplo, o ID 4 foi achado no array. 16/01/2018 às 12:20
  • Ok, percebi. Deixa ver melhor seu código 16/01/2018 às 12:24
1

Uma solução simples é ir criando as ultimas coordenadas à medida que adiciona novas com um dicionario, utilizando o id como chave para que não tenha ids repetidos.

Para isso necessita apenas de alterar o seu método popularListaCoordenadas:

private popularListaCoordenadas(coord) {
    this.coordenadas.push({
        id: coord.id, latitude: coord.latitude, longitude: coord.longitude
    });

    if (!this.ultimasCoords){ //se não existe o dicionario cria
        this.ultimasCoords = {};
    }

    this.ultimasCoords[coord.id] = { //guarda a coordenada pelo id
        id: coord.id, latitude: coord.latitude, longitude: coord.longitude
    };
}

Agora para utilizar as ultimas coordenadas de cada id precisa apenas de um for:

for (let idCoord of Object.keys(this.ultimasCoords)){
    let coordenada = this.ultimasCoords[idCoord];
    //fazer algo com a coordenada
}

Exemplo a funcionar:

let coords = [
    {id: 6,latitude: 175,longitude: 601}, 
    {id: 6,latitude: 177,longitude: 604}, 
    {id: 6,latitude: 177,longitude: 604}, 
    {id: 5,latitude: 0,longitude: 1}, 
    {id: 5,latitude: 4,longitude: 4}, 
    {id: 5,latitude: 8,longitude: 9}, 
    {id: 5,latitude: 26,longitude: 37}, 
    {id: 5,latitude: 49,longitude: 95}, 
    {id: 5,latitude: 195,longitude: 448}, 
    {id: 5,latitude: 215,longitude: 499}, 
    {id: 5,latitude: 215,longitude: 500}, 
    {id: 3,latitude: 1,longitude: 2}
];

let obj = {
  coordenadas : [],
  popularListaCoordenadas : function(coord) {
    this.coordenadas.push({
      id: coord.id,
      latitude: coord.latitude,
      longitude: coord.longitude
    });

    if (!this.ultimasCoords) { 
      this.ultimasCoords = {};
    }

    this.ultimasCoords[coord.id] = {
      id: coord.id, latitude: coord.latitude, longitude: coord.longitude
    };
  }
};

for (let i = 0;i < coords.length; ++i){ 
  obj.popularListaCoordenadas(coords[i]);
}

for (let idCoord of Object.keys(obj.ultimasCoords)) {
  let coordenada = obj.ultimasCoords[idCoord];
  console.log(coordenada);
}

0

Você pode percorrer cada elemento guardando a última coordenada de acordo com o id, sobrescrevendo a última ocorrência. Isso garante que no final você terá somente a última ocorrência de cada coordenada de id duplicado.

const coordenadas = [
    { id: 6, latitude: 175, longitude: 601 },
    { id: 6, latitude: 177, longitude: 604 },
    { id: 6, latitude: 177, longitude: 604 },
    { id: 5, latitude: 0, longitude: 1 },
    { id: 5, latitude: 4, longitude: 4 },
    { id: 5, latitude: 8, longitude: 9 },
    { id: 5, latitude: 26, longitude: 37 },
    { id: 5, latitude: 49, longitude: 95 },
    { id: 5, latitude: 195, longitude: 448 },
    { id: 5, latitude: 215, longitude: 499 },
    { id: 5, latitude: 215, longitude: 500 },
    { id: 3, latitude: 1, longitude: 2 }
];

let resultado = {};
coordenadas.forEach((item) => resultado[item.id] = item);

console.log(resultado);

2
  • Essa solução simples funcionou para mim. Agradeço a todos que tentaram me ajudar. 16/01/2018 às 16:40
  • @MaiconCosta considere marcar a resposta como aceita.
    – mercador
    16/01/2018 às 17:38
0

Precisa percorrer seu array de coordenadas e identificar o índice do objeto-coordenada com o ID desejado:

var coordenadas = [
    {id: 1, quantity: 2},
    {id: 2, quantity: 0},
    {id: 3, quantity: 5}
];

function findID(element, index, array) { 
    //forneça o id procurado aqui, ou vindo de outra variável
    var idSearch = 2;
    return element.id == idSearch ;
}

console.log(coordenadas.find(findID)); 
// {id: 2, quantity: 0}
6
  • Vou fazer um teste, e lhe retorno. 16/01/2018 às 12:29
  • Não se esqueça de adaptar ao seu código! 16/01/2018 às 12:31
  • Porém meu array coordenadas, antes de aplicar a função, fica assim: 37: {id: 6, latitude: 175, longitude: 601} 38: {id: 6, latitude: 177, longitude: 604} 39: {id: 6, latitude: 177, longitude: 604} 40: {id: 5, latitude: 0, longitude: 1} 41: {id: 5, latitude: 4, longitude: 4} 42: {id: 5, latitude: 8, longitude: 9} 43: {id: 5, latitude: 26, longitude: 37} 44: {id: 5, latitude: 49, longitude: 95} 45: {id: 5, latitude: 195, longitude: 448} 46: {id: 5, latitude: 215, longitude: 499} 47: {id: 5, latitude: 215, longitude: 500} 48: {id: 3, latitude: 1, longitude: 2} 16/01/2018 às 12:44
  • A questão é que no meio desses elementos de ID repetido, quero pegar apenas o último registrado de cada ID. 16/01/2018 às 12:44
  • Entendi. Pra esse caso a resposta é diferente da que foi dada pra sua pergunta inciial. Vou reformular e postar uma segunda resposta 16/01/2018 às 12:55
0

Precisa percorrer seu array de coordenadas e identificar os índices dos objetos-coordenadas com os IDs desejados:

    var coordenadas = [
        {id: 1, quantity: 2},
        {id: 2, quantity: 0},
        {id: 3, quantity: 5},
        {id: 4, quantity: 5},
        {id: 5, quantity: 5},
    ];

   //IDs que vc procura
    var targetIDs = [2, 5];

    function findID(element, index, array) { 
        //filtra elementos desejados
        return targetID.find(selement.id);
    }

    //vetor resultado
    var resultElements = coordenadas.filter(findID);

    console.log(resultElements); 
    // [{id: 2, quantity: 0 }, {id: 5, quantity: 5}]

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .