 |
|
Você está aqui: HTML5 ::: Canvas Element ::: Contexto de Desenho |
Como definir a largura da linha do contexto de desenho do Canvas do HTML 5 usando a propriedade lineWidthQuantidade de visualizações: 401 vezes |
|
A propriedade lineWidth do contexto de desenho do Canvas do HTML5 é usada quando precisamos definir ou obter a largura da linha na qual um desenho vai ser ou foi realizado. Esta propriedade aceita e retorna um valor numérico. Veja um exemplo de seu uso para definir a largura (ou espessura) de uma linha: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>O objeto Canvas do HTML5</title>
</head>
<body>
<Canvas id="canvas1" width="500" height="350"></Canvas>
<script type="text/javascript">
// obtemos uma referência ao elemento Canvas
var canvas = document.getElementById("canvas1");
// obtemos o contexto de desenho
var contexto = canvas.getContext("2d");
// vamos definir a largura da linha como 10 pixels
contexto.lineWidth = 10;
contexto.beginPath(); // inicia ou reseta o caminho anterior
contexto.moveTo(20, 20); // move a caneta para x, y
contexto.lineTo(300, 20); // coordenadas x, y
contexto.stroke(); // finaliza o desenho
</script>
</body>
</html>
Ao executar este código você verá uma linha com largura de 10 pixels ser desenhada na horizontal. É possível também usar a propriedade lineWidth para retornar a largura da linha do contexto de desenho. Veja um exemplo no qual nós desenhamos três linhas, cada uma o dobro da espessura da anterior: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>O objeto Canvas do HTML5</title>
</head>
<body>
<Canvas id="canvas1" width="500" height="350"></Canvas>
<script type="text/javascript">
// obtemos uma referência ao elemento Canvas
var canvas = document.getElementById("canvas1");
// obtemos o contexto de desenho
var contexto = canvas.getContext("2d");
// vamos definir a largura da linha como 5 pixels
contexto.lineWidth = 5;
contexto.beginPath(); // inicia ou reseta o caminho anterior
contexto.moveTo(20, 20); // move a caneta para x, y
contexto.lineTo(300, 20); // coordenadas x, y
contexto.stroke(); // finaliza o desenho
// vamos dobrar a espessura da linha
contexto.lineWidth = contexto.lineWidth * 2;
contexto.beginPath(); // inicia ou reseta o caminho anterior
contexto.moveTo(20, 50); // move a caneta para x, y
contexto.lineTo(300, 50); // coordenadas x, y
contexto.stroke(); // finaliza o desenho
// vamos dobrar a espessura da linha novamente
contexto.lineWidth = contexto.lineWidth * 2;
contexto.beginPath(); // inicia ou reseta o caminho anterior
contexto.moveTo(20, 80); // move a caneta para x, y
contexto.lineTo(300, 80); // coordenadas x, y
contexto.stroke(); // finaliza o desenho
</script>
</body>
</html>
|
 Link para compartilhar na Internet ou com seus amigos: |
Java ::: Java para Engenharia ::: Geometria Analítica e Álgebra Linear |
Como converter Coordenadas Cartesianas para Coordenadas Polares usando Java - Java para EngenhariaQuantidade de visualizações: 1818 vezes |
|
Nesta nossa série de Java para Geometria Analítica e Álgebra Linear, mostrarei um código 100% funcional para fazer a conversão entre coordenadas cartesianas e coordenadas polares. Esta operação é muito frequente em computação gráfica e é parte integrante das disciplinas dos cursos de Engenharia (com maior ênfase na Engenharia Civil). Na matemática, principalmente em Geometria e Trigonometria, o sistema de Coordenadas no Plano Cartesiano, ou Espaço Cartesiano, é um sistema que define cada ponto em um plano associando-o, unicamente, a um conjuntos de pontos numéricos. Dessa forma, no plano cartesiano, um ponto é representado pelas coordenadas (x, y), com o x indicando o eixo horizontal (eixo das abscissas) e o y indicando o eixo vertical (eixo das ordenadas). Quando saímos do plano (espaço 2D ou R2) para o espaço (espaço 3D ou R3), temos a inclusão do eixo z (que indica profundidade). Já o sistema de Coordenadas Polares é um sistema de coordenadas em duas dimensões no qual cada ponto no plano é determinado por sua distância a partir de um ponto de referência conhecido como raio (r) e um ângulo a partir de uma direção de referência. Este ângulo é normalmente chamado de theta (__$\theta__$). Assim, um ponto em Coordenadas Polares é conhecido por sua posição (r, __$\theta__$). Antes de prosseguirmos, veja uma imagem demonstrando os dois sistemas de coordenadas:  A fórmula para conversão de Coordenadas Cartesianas para Coordenadas Polares é: __$r = \sqrt{x^2+y2}__$ __$\theta = \\arctan\left(\frac{y}{x}\right)__$ E aqui está o código Java completo que recebe as coordenadas cartesianas (x, y) e retorna as coordenadas polares (r, __$\theta__$): ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
package arquivodecodigos;
import java.util.Scanner;
public class Estudos{
public static void main(String args[]){
Scanner entrada = new Scanner(System.in);
// vamos ler as coordenadas cartesianas
System.out.print("Valor de x: ");
double x = Double.parseDouble(entrada.nextLine());
System.out.print("Valor de y: ");
double y = Double.parseDouble(entrada.nextLine());
// vamos calcular o raio
double raio = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
// agora calculamos o theta (ângulo) em radianos
double theta = Math.atan2(y, x);
// queremos o ângulo em graus também
double angulo_graus = 180 * (theta / Math.PI);
// e exibimos o resultado
System.out.println("As Coordenadas Polares são:\n" +
"raio = " + raio + ", theta = " + theta + ", ângulo em graus = " +
angulo_graus);
}
}
Ao executar este código nós teremos o seguinte resultado: Valor de x: -1 Valor de y: 1 As Coordenadas Polares são: raio = 1.4142135623730951, theta = 2.356194490192345, ângulo em graus = 135.0 Veja que as coordenadas polares equivalentes são (__$\sqrt{2}__$, __$\frac{3\pi}{4}__$), com o theta em radianos. Sim, os professores das disciplinas de Geometria Analítica e Álgebra Linear, Física e outras gostam de escrever os resultados usando raizes e frações em vez de valores reais. |
C++ ::: Dicas & Truques ::: Strings e Caracteres |
Como acessar os caracteres individuais de uma string em C++ usando a função at()Quantidade de visualizações: 7094 vezes |
|
Nesta dica mostrarei como podemos usar a função at() para percorrer os caracteres individuais de uma palavra, frase ou texto em C++. Esta função recebe o índice do caractere que queremos acessar e retorna o caractere correspondente. Note que o índice começa em 0. Veja o código C++ completo para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
#include <iostream>
#include <string>
using namespace std;
// função principal do programa
int main(int argc, char *argv[]){
// vamos criar uma nova string
string palavra("PYTHON");
// vamos percorrer os caracteres um de cada vez
for(int i = 0; i < palavra.size(); i++){
cout << palavra.at(i) << "\n";
}
cout << "\n\n";
system("PAUSE"); // pausa o programa
return EXIT_SUCCESS;
}
Ao executar este código C++ nós teremos o seguinte resultado: P Y T H O N |
JavaScript ::: Dicas & Truques ::: Set (Conjunto) |
Como converter um Set em um Array JavaScript usando a função Array.from()Quantidade de visualizações: 937 vezes |
|
Em algumas situações nós gostaríamos de tratar um objeto Set da linguagem JavaScript como se ele fosse um Array, ou seja, um vetor (matriz de apenas uma linha e várias colunas). Para estes casos nós podemos usar o método Array.from(), adicionado à linguagem JavaScript na revisão ECMAScript 2015 (ES6 ou ECMAScript 6). Este método recebe vários objetos, entre eles Map e Set, e retorna um array. Assim, veja um trecho de código no qual criamos um Set com três elementos, usamos o método Array.from() para obter um Array a partir dele e, em seguida, percorremos e exibimos os elementos do array. Eis o código completo para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>O objeto Set do JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos criar um novo conjunto contendo
// 3 linguagens de programação
var linguagens = new Set(["Java", "PHP", "Delphi"]);
// agora vamos converter este Set em um Array
var vetor = Array.from(linguagens);
// vamos percorrer os elementos do vetor
for(var i = 0; i < vetor.length; i++){
document.writeln(vetor[i] + "<br>");
}
</script>
</body>
</html>
Ao executar este código nós teremos o seguinte resultado: Java PHP Delphi |
Java ::: Desafios e Lista de Exercícios Resolvidos ::: Java Básico |
Exercícios Resolvidos de Java - Valor da diária, valor médio arrecadado com e sem promoção e o lucro ou prejuízo mensal de uma promoção em um hotelQuantidade de visualizações: 14172 vezes |
|
Pergunta/Tarefa: Escreva um programa Java para resolver o seguinte problema: Um hotel com 42 apartamentos resolveu fazer promoções para os fins de semana fora da alta temporada, isto é, nos meses de abril, maio, junho, agosto, setembro, outubro e novembro. A taxa da promoção é de 22% da diária normal. A ocupação média do hotel sem promoção é de 40%. A expectativa é aumentar a taxa de ocupação para 70%. Supondo que as expectativas se confirmem, escrever um algoritmo que lê a diária normal, que calcule e escreva as seguintes informações: (a) O valor da diária no período da promoção. (b) O valor médio arrecadado sem a promoção, durante um mês. (c) O valor médio arrecadado com a promoção, durante um mês. (d) O lucro ou prejuízo mensal com a promoção. Seu código Java deverá apresentar uma saída parecida com: Informe o valor da diária normal: 120 Diária no período de promoção: 26,40 Média arrecadada sem a promoção durante um mês: 8064,00 Média arrecadada com a promoção durante um mês: 3104,64 Prejuízo mensal com a promoção: 4959,36 Veja a resolução comentada deste exercício usando Java console (lendo a entrada do usuário por meio do uso da classe Scanner): ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
package estudos;
import java.util.Scanner;
public class Estudos {
public static void main(String[] args) {
// vamos criar um objeto da classe Scanner
Scanner entrada = new Scanner(System.in);
// valor da diária em período normal
double valor_diaria_normal;
// valor da diária no período de promoção
double valor_diaria_promocao;
// vamos obter o valor da diária no período normal
System.out.print("Informe o valor da diária normal: ");
valor_diaria_normal = Double.parseDouble(entrada.nextLine());
// vamos obter o valor da diária no período promocional
valor_diaria_promocao = valor_diaria_normal * (22.0 / 100.0);
// vamos calcular o valor médio arrecadado sem a promoção, durante um mês
// estamos assumindo 4 finais de semana por mês
double media_arrecado_sem_promocao = (valor_diaria_normal
* (42 * (40.0 / 100.0)) * 4);
// vamos calcular o valor médio arrecadado com a promoção, durante um mês
// estamos assumindo 4 finais de semana por mês
double media_arrecado_com_promocao = (valor_diaria_promocao
* (42 * (70.0 / 100.0)) * 4);
System.out.printf("Diária no período de promoção: %.2f\n",
valor_diaria_promocao);
System.out.printf("Média arrecadada sem a promoção durante um mês: %.2f\n",
media_arrecado_sem_promocao);
System.out.printf("Média arrecadada com a promoção durante um mês: %.2f\n",
media_arrecado_com_promocao);
// houve lucro ou prejuízo?
if (media_arrecado_sem_promocao < media_arrecado_com_promocao) {
System.out.printf("Lucro mensal com a promoção: %.2f\n",
media_arrecado_com_promocao - media_arrecado_sem_promocao);
}
else {
System.out.printf("Prejuízo mensal com a promoção: %.2f\n",
media_arrecado_sem_promocao - media_arrecado_com_promocao);
}
}
}
|
Ruby ::: Dicas & Truques ::: Strings e Caracteres |
Como converter uma string em um valor real em Ruby usando a função to_fQuantidade de visualizações: 6132 vezes |
|
Nesta dica mostrarei como podemos usar a função to_f do objeto String da linguagem Ruby para converter uma string em um valor de ponto-flutuante, ou seja, um valor real, com casas decimais. Veja o código completo para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
# Este exemplo mostra como usar o método to_f
# para converter uma string em um valor numérico
# de ponto-flutuante
# vamos pedir para o usuário informar
# dois números
print "Informe o primeiro número: "
num1 = (gets.chomp).to_f
print "Informe o segundo número: "
num2 = (gets.chomp).to_f
# vamos exibir a soma dos valores informados
puts "A soma dos valores é: #{num1 + num2}"
Ao executar este código Ruby nós teremos o seguinte resultado: Informe o primeiro número: 5 Informe o segundo número: 3 A soma dos valores é: 8.0 Note que usei gets para ler o texto informado pelo usuário. Em seguida usei chomp para remover quaisquer quebras de linhas no final do texto e, finamente, usei to_f para converter a string lida em um valor do tipo float. |
Desafios, Exercícios e Algoritmos Resolvidos de Ruby |
Veja mais Dicas e truques de Ruby |
Dicas e truques de outras linguagens |
Códigos Fonte |
 Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimentoDiga 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 |
 Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesTenha 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 |
