 |
|
||||
Você está aqui: Cards de Cards de Hidrologia |
||
|
||
 Link para compartilhar na Internet ou com seus amigos: |
||
HTML5 ::: HTML5 + JavaScript ::: Canvas |
Como usar o método arc() do objeto Canvas do HTML5 para desenhar arcos, curvas e círculosQuantidade de visualizações: 4482 vezes |
O método arc() do objeto Canvas do HTML5 nos permite criar figuras tais como arcos, curvas e círculos. Para isso é importante entender os seus parâmetros:arc(x, y, radius, ang1, ang2, direction); Os parâmetros x e y indicam as coordenadas do centro do círculo. O parâmetro radius indica o raio do círculo. Os parâmetros ang1 e ang2 indicam o ângulo inicial e o ângulo final. O parâmetro direction indica a direção do desenho. Se o valor true for informado, a direção será anti-horário. Se for false, o desenho será no sentido horário. É importante observar que os ângulos são medidos em radianos, não em graus. Assim, o ângulo 0 representa a posição 3 horas no relógio. A posição de 9 horas é (1 * PI), 12 horas é (1.5 * PI) e 6 horas é (0.5 * PI). Portanto, se você quiser desenhar um círculo completo, deverá sair do ângulo 0 e ir até (2 * PI). Veja um trecho de código que desenha um arco equivalente a um quarto de uma pizza, ou seja, 25%, saindo do ângulo 90º (em graus) e indo até 180º (graus):
<html>
<head>
<meta charset="utf-8">
<title>Estudos 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 desenhar um arco sem preenchimento com raio de 80
contexto.beginPath(); // início um novo caminho
// o arco começa no x = 100, y = 100, começa no ângulo 90 (em graus)
// e vai até o ânculo 180 (graus)
// as medidas na função arc() são em radianos, não em graus
contexto.arc(100, 100, 80, Math.PI, 1.5 * Math.PI, false);
contexto.lineWidth = 2; // largura da linha
contexto.strokeStyle = '#990000'; // cor da linha
contexto.stroke(); // realiza o desenho
</script>
</body>
</html>
Execute este código e veja que o arco realmente foi desenhado. Seu resultado deverá ser parecido com:  No entanto, para parecer um pedação de pizza, ou seja, o ponto de partida para um gráfico de pizza, é preciso que tenhamos duas linhas ligado esse arco ao centro do círculo. Veja a modificação que fiz:
<html>
<head>
<meta charset="utf-8">
<title>Estudos 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 desenhar um arco sem preenchimento com raio de 80
contexto.beginPath(); // início um novo caminho
// primeiro movemos a caneta de desenho para o centro do círculo
contexto.moveTo(100, 100);
// o arco começa no x = 100, y = 100, começa no ângulo 90 (em graus)
// e vai até o ânculo 180 (graus)
// as medidas na função arc() são em radianos, não em graus
contexto.arc(100, 100, 80, Math.PI, 1.5 * Math.PI, false);
contexto.lineWidth = 2; // largura da linha
contexto.strokeStyle = '#990000'; // cor da linha
// agora desenhamos uma linha de volta para o arco
contexto.lineTo(100, 100);
contexto.stroke(); // realiza o desenho
</script>
</body>
</html>
Execute novamente e veja que agora o efeito ficou bem melhor. Seu resultado deverá ser parecido com:  Para finalizar, vamos colorir o pedação de pizza. Veja a nova versão (com o código completo):
<!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 desenhar um arco sem preenchimento com raio de 80
contexto.beginPath(); // início um novo caminho
// primeiro movemos a caneta de desenho para o centro do círculo
contexto.moveTo(100, 100);
// o arco começa no x = 100, y = 100, começa no ângulo 90 (em graus)
// e vai até o ânculo 180 (graus)
// as medidas na função arc() são em radianos, não em graus
contexto.arc(100, 100, 80, Math.PI, 1.5 * Math.PI, false);
contexto.lineWidth = 2; // largura da linha
contexto.strokeStyle = '#990000'; // cor da linha
// agora desenhamos uma linha de volta para o arco
contexto.lineTo(100, 100);
// vamos preencher o gráfico
contexto.fillStyle = "#CCCCCC"; // cor do preenchimento
contexto.fill(); // preenche de fato
contexto.stroke(); // realiza o desenho
</script>
</body>
</html>
Agora o resultado será:  |
Ruby ::: Dicas & Truques ::: Data e Hora |
Como retornar os minutos em Ruby a partir de um objeto da classe Time usando a função minQuantidade de visualizações: 6510 vezes |
|
Muitas vezes precisamos obter os minutos de uma determinada hora a partir de um determinado objeto Time. Para isso a classe Time nos fornece o método min. Este método retorna um número inteiro na faixa 0..59. Veja uma demonstração de como usar este método no trecho de código a seguir: # constrói um objeto Time com a data e hora atual agora = Time.now # obtém os minutos minutos = agora.min # exibe o resultado puts "Os minutos são: " + minutos.to_s Ao executar este código Ruby nós teremos o seguinte resultado: Os minutos são: 7 |
Ruby ::: Dicas & Truques ::: Hashes (Arrays Associativas) |
Como criar um hash em Ruby - Criação e uso de arrays associativos na linguagem RubyQuantidade de visualizações: 9540 vezes |
|
Os hashes (também chamados de arrays associativas, mapas ou dicionários) são parecidos com arrays no sentido em que são coleções indexadas de referências a objetos. Contudo, enquanto podemos indexar arrays usando inteiros, hashes podem ser indexados usando-se qualquer tipo de dados: strings, expressões regulares, inteiros, e assim por diante. Quando guardamos um valor em um hash, estamos na verdade guardando dois objetos: o índice (geralmente chamado de chave) e o valor. Os valores em um hash Ruby podem ser de qualquer tipo. Hashes em Ruby podem ser criados de duas formas: usando a notação literal ou criando-se um objeto da classe Hash. Veja como criamos um hash usando notação literal:
# cria um hash de estados e capitais
capitais = {'Goiás' => 'Goiânia', 'Mato Grosso' => 'Cuiabá',
'Paraná' => 'Curitiba'}
# exibe a capital correspondente ao estado de Mato Grosso
puts capitais['Mato Grosso']
Veja como usamos os nomes dos estados como chaves e os nomes das capitais como valores para cada um dos elementos do hash. Veja agora como criar este mesmo hash por meio da criação de um objeto da classe Hash: # cria um hash de estados e capitais capitais = Hash.new capitais['Goiás'] = 'Goiânia' capitais['Mato Grosso'] = 'Cuiabá' capitais['Paraná'] = 'Curitiba' # exibe a capital correspondente ao estado de Mato Grosso puts capitais['Mato Grosso'] |
C# ::: Dicas & Truques ::: Sistema |
Como verificar o formato de um drive (NTFS, FAT32, etc) usando a propriedade DriveFormat da classe DriveInfo da linguagem C#Quantidade de visualizações: 7543 vezes |
|
A propriedade DriveFormat da classe DriveInfo pode ser usada para obter o formato de um drive, ou seja, ela nos permite saber se o formato de um drive é NTFS ou FAT32, por exemplo. Veja um trecho de código exemplificando seu uso:
using System;
using System.IO;
namespace Estudos{
class Program{
static void Main(string[] args) {
DriveInfo di = new DriveInfo("C");
// vamos obter o formato deste drive
string formato = di.DriveFormat;
// vamos exibir o resultado
Console.WriteLine("O formato deste drive é: " + formato);
}
}
}
Ao executar este código nós teremos o seguinte resultado: O formato deste drive é: NTFS |
Java ::: Dicas & Truques ::: Imagens e Processamento de Imagens |
Manipulação de imagens em Java - Como carregar imagens JPG (JPEG), GIF ou PNG usando o método getImage() da classe ToolkitQuantidade de visualizações: 24141 vezes |
|
O método getImage() da classe Toolkit retorna um objeto da classe Image que obtém informações de imagem (pixels) a partir do caminho informado. Veja que este método não verifica se a imagem informada para o método existe ou se foi carregada com sucesso. Veja mais dicas nesta seção para aprender a realizar tais tarefas. O código abaixo mostra como chamar o método getImage() para carregar uma imagem ao clicar em um botão:
package arquivodecodigos;
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class Estudos extends JFrame{
private Image imagem = null;
public Estudos() {
super("Estudos Java");
Container c = getContentPane();
c.setLayout(new FlowLayout());
JButton btn = new JButton("Carregar Imagem");
btn.addActionListener(
new ActionListener(){
@Override
public void actionPerformed(ActionEvent e){
// imagem a ser carregada
String minhaImagem = "C:\\estudos_java\\lago.jpg";
// Obtém o Toolkit padrão
Toolkit toolkit =
Toolkit.getDefaultToolkit();
imagem = toolkit.getImage(minhaImagem);
JOptionPane.showMessageDialog(null,
"A imagem foi carregada. Agora é só manipulá-la.");
}
}
);
c.add(btn);
setSize(400, 300);
setVisible(true);
}
public static void main(String args[]){
Estudos app = new Estudos();
app.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
Ao executar este código nós teremos o seguinte resultado: A imagem foi carregada. Agora é só manipulá-la. |
Desafios, Exercícios e Algoritmos Resolvidos de Java |
Veja mais Dicas e truques de Java |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
