Você está aqui: JavaScript ::: Dicas & Truques ::: Geometria, Trigonometria e Figuras Geométricas |
Como calcular o ponto médio entre dois pontos no plano usando JavaScript - Geometria com JavaScriptQuantidade de visualizações: 2051 vezes |
Nesta dica mostrarei como é possível usar um trecho de código JavaScript para obter o ponto médio entre dois pontos quaisquer no plano, ou seja, no R2. Em mais dicas dessa seção você aprenderá como isso pode ser feito no R3 (espaço) Comece analisando a figura abaixo, na qual temos dois pontos A e B, com suas coordenadas correspondentes, e o ponto médio M: ![]() Assim, dados dois pontos A = (2, 9) e B = (10, 2) no plano cartesiano R2, as coordenadas x e y do ponto médio são calculadas por meio da seguinte fórmula: \[x = \frac{x_1 + x_2}{2}\] \[y = \frac{y_1 + y_2}{2}\] Colocando na fórmula os valores que já temos: \[x = \frac{2 + 10}{2} = \frac{12}{2} = 6 \] \[y = \frac{9 + 2}{2} = \frac{11}{2} = 5.5 \] Assim, as coordenadas do ponto médio será (x = 6, y = 5.5). E agora veja o código JavaScript completo para calcular as coordenadas do ponto médio a partir de dois pontos no plano cartesiano (plano 2D ou R2): ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- <!doctype html> <html> <head> <title>Estudos JavaScript</title> </head> <body> <script type="text/javascript"> // x e y do primeiro ponto var x1 = 2; var y1 = 9; // x e y do segundo ponto var x2 = 10; var y2 = 2; // vamos calcular as coordenadas x e y do ponto médio var x = (x1 + x2) / 2; var y = (y1 + y2) / 2; // vamos mostrar o resultado document.writeln("As coordenadas do ponto médio são: (x = " + x + ", y = " + y + ")"); </script> </body> </html> Ao executarmos este código JavaScript nós teremos o seguinte resultado: Coordenada x do primeiro ponto: 2 Coordenada y do primeiro ponto: 9 Coordenada x do segundo ponto: 10 Coordenada y do segundo ponto: 2 As coordenadas do ponto médio sao: (x = 6, y = 5.5) |
![]() |
JavaScript ::: Dicas & Truques ::: Trigonometria - Funções Trigonométricas |
Como calcular o cateto oposto dadas as medidas da hipotenusa e do cateto adjascente em JavaScriptQuantidade de visualizações: 1426 vezes |
Todos estamos acostumados com o Teorema de Pitágoras, que diz que "o quadrado da hipotenusa é igual à soma dos quadrados dos catetos". Baseado nessa informação, fica fácil retornar a medida do cateto oposto quando temos as medidas da hipotenusa e do cateto adjascente. Isso, claro, via programação em linguagem JavaScript. Comece observando a imagem a seguir: ![]() Veja que, nessa imagem, eu já coloquei os comprimentos da hipotenusa, do cateto oposto e do cateto adjascente. Para facilitar a conferência dos cálculos, eu coloquei também os ângulos theta (que alguns livros chamam de alfa) e beta já devidamente calculados. A medida da hipotenusa é, sem arredondamentos, 36.056 metros. Então, sabendo que o quadrado da hipotenusa é igual à soma dos quadrados dos catetos (Teorema de Pitógoras): \[c^2 = a^2 + b^2\] Tudo que temos que fazer é mudar a fórmula para: \[a^2 = c^2 - b^2\] Veja que agora o quadrado do cateto oposto é igual ao quadrado da hipotenusa menos o quadrado do cateto adjascente. Não se esqueça de que a hipotenusa é o maior lado do triângulo retângulo. Veja agora como esse cálculo é feito em linguagem JavaScript: ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- <html> <head> <title>Estudos JavaScript</title> </head> <body> <script type="text/javascript"> var c = 36.056; // medida da hipotenusa var b = 30; // medida do cateto adjascente // agora vamos calcular o comprimento da cateto oposto var a = Math.sqrt(Math.pow(c, 2) - Math.pow(b, 2)); // e mostramos o resultado document.writeln("A medida do cateto oposto é: " + a); </script> </body> </html> Ao executar este código JavaScript nós teremos o seguinte resultado: A medida do cateto oposto é: 20.00087838071118 Como podemos ver, o resultado retornado com o código JavaScript confere com os valores da imagem apresentada. |
JavaScript ::: Dicas & Truques ::: Matemática e Estatística |
Como calcular raiz quadrada usando o método sqrt() do objeto Math do JavaScriptQuantidade de visualizações: 15164 vezes |
Em várias situações, principalmente quando estamos desenvolvendo códigos para aplicações financeiras, nós precisamos calcular a raiz quadrada de um determinado valor numérico. Para isso nós podemos usar a função sqrt() do objeto Math da linguagem JavaScript. Esta função recebe um valor numérico (inteiro ou real) e desenvolve também um valor numérico. Veja um exemplo de seu uso: ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- <!doctype html> <html> <head> <title>Estudando JavaScript</title> </head> <body> <script type="text/javascript"> var numero = 9; var raiz = Math.sqrt(numero); document.write("A raiz quadrada de " + numero + " é " + raiz); </script> </body> </html> Ao executar este código JavaScript nós teremos o seguinte resultado: A raiz quadrada de 9 é 3 |
JavaScript ::: Web APIs (APIs Web) ::: MediaDevices Interface (Interface MediaDevices) |
Como acessar as mídias do usuário em JavaScript usando a função getUserMedia() da interface MediaDevicesQuantidade de visualizações: 2638 vezes |
O método getUserMedia() da interface MediaDevices nos permite acessar as entradas de mídias do usuários, tais como áudio e vídeo. Isso facilita o desenvolvimento de aplicações muito interessantes, a saber, tirar foto usando a webcam, gravar áudio a partir do microfone, gravar vídeo a partir da webcam, etc. No entanto, antes de usar o MediaStream retornado pelo método getUserMedia(), é importante saber que o usuário deverá dar a sua permissão. Assim, sempre que o método getUserMedia() é chamado, uma janela de informação é mostrada para que o usuário concorde ou não em permitir o acesso às suas mídias. Veja, por exemplo, como solicitar acesso à webcam/câmera do usuário: ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>A interface MediaDevices</title> </head> <body> <script type="text/javascript"> async function obterMediaUsuario(){ // vamos obter o stream var stream = null; try{ stream = await navigator.mediaDevices.getUserMedia({video: true}); window.alert("A mídia para vídeo foi obtida com sucesso."); // agora podemos fazer algo com o stream aqui } catch(erro){ window.alert("Houve um erro: " + erro); } } // o browser suporta o MediaDevices? if(navigator.mediaDevices){ obterMediaUsuario() } else{ window.alert("O navegador não suporta o MediaDevices"); } </script> </body> </html> Veja que usamos uma função assíncrona para getUserMedia(). Isso é necessário porque esta função retorna uma Promise que, em caso de sucesso, será convertida em um objeto MediaStream. Se o usuário não permitir o acesso, um erro do tipo NotAllowedError ou NotFoundError será retornado. Alguns navegadores só permitem o uso do método getUserMedia() em ambiente seguro HTTPS ou localhost. Em mais dicas dessa seção você verá como tirar proveito do MediaStream retornado pela função getUserMedia() e também como tratar melhor os erros retornados. |
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
JavaScript - Como testar se todos os elementos de um array satisfazem uma condição em JavaScript usando a função every() |
Códigos Fonte |
![]() Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais |
![]() Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais |
Linguagens Mais Populares |
1º lugar: Java |