Criando gráfico em canvas

Apresentação em tema: "Criando gráfico em canvas"— Transcrição da apresentação:

1 Criando gráfico em canvas
Nova modelagem

2 Crie um novo documento no Flash CC
Utilize a opção ActionScript 3.0

3 Crie seu gráfico e o anime

4 Sempre separe os textos em duas layers.
Crie um layer guia e copie o texto. Esse procedimento será necessário para fazer as alterações de texto na revisão. Na layer txt converta o texto em curvas (CTRL + B)

5 No último frame insira o seguinte código
this.stop(); /* this.onClipAnimationComplete() */

6 Salve seu arquivo. Padrão: nome da tela_grafico_a
Ex: 1_2_1_grafico_a.fla

7 Selecione a opção abaixo no menu superior.

8 Salve novamente seu arquivo com outro nome.
Padrão: nome da tela_grafico_a_canvas Ex: 1_2_1_grafico_a_canvas.fla

9 Exporte seu arquivo (CTRL + ENTER)

10 Na pasta em que você salvou haverá um arquivo. js com o mesmo nome
Na pasta em que você salvou haverá um arquivo.js com o mesmo nome. Copie o arquivo para a pasta js do curso. pag/js Se o seu gráfico tiver imagens elas serão salvas na pasta images. Copie-as para a pasta img do curso.

11 No dreamweaver abra o arquivo .js e procure a palavra stop.

12 Tire as marcações de comentário do código.

13 Se estiver usando images não esqueça de trocar o caminho no arquivo js

14 Insira o gráfico na tela.
Em data-biblioteca sempre há um _ na frente do nome do arquivo. Não esqueça de inserir o tamanho do gráfico.