Linha de borda na cor cinza e fecho a linha de código com ponto e vírgula largura do objeto comando width dois pontos 410 pixels ponto e vírgula altura comando heiht dois pontos 330 pixels ponto e vírgula distância do Topo dois pontos 125 pixels ponto e vírgula distância da esquerda left dois pontos 20 pixels ponto e vírgula definido estilo da div gráfico pizza de volta no arquivo gráfico ponto HTML agora nós vamos reaproveitar esta linha de código.
Podem copiar e colar logo abaixo e esta vai ser a div gráfico linhas próximo passo é definir o estilo desta div copia o id e acessa o arquivo estilo gráfico Deixa eu subir para facilitar a visualização coloca um jogo da velha controlv e abre e fecha Chaves e dentro das chaves comando position dois pontos Absolute e ponto e vírgula border comando border dois pontos vai ser um pixel espaço borda sólida espaço jogo da velha 80 80 80 e ponto e vírgula e agora nós vamos definir.
A largura comando width dois pontos 640 pixels e ponto e vírgula altura comando height dois pontos eu vou colocar 330 pixels ponto e vírgula distância do Topo dois pontos 125 pixels ponto e vírgula distância da esquerda comando left dois pontos 430 pixels e ponto e vírgula salva as alterações e vamos testar para ver se as dives estão posicionadas corretamente show de bola pessoal já está visível as duas dives na primeira div nós vamos colocar um gráfico de pizza e na.
Segunda div vai ser um gráfico de linha podem fechar o formulário e voltar no editor e agora vocês vão acessar o arquivo gráfico traço JS e descer até localizar a função relatório aqui nós vamos fazer alguns ajustes nesta função primeiro ajuste É no início da função limpar as duas dives então document ponto getelement by ID abre e fecha parênteses e abre e fecha aspas duplas dentro dos parênteses e dentro das aspas duplas vai o ID da div então acessem o arquivo gráfico HTML e podem.
Array dadosrel depois de definir o array nós vamos colocar uma linha manualmente para colocar o cabeçalho da tabela porque nós precisamos montar uma tabela para conseguir fazer o gráfico de pizza então podem copiar array dadosrel dados igual e abre e fecha parênteses e dentro dos parênteses vocês vão abrir e fechar colchetes e dentro dos colchetes abre e fecha aspas duplas e dentro das aspas duplas primeira coluna vai ser para os produtos fora das aspas duplas vírgula e abre e.
Fecha aspas duplas segunda coluna vai ser o total fora das aspas duplas vírgula e abre e fecha aspas duplas nós vamos ter a quantidade e fecha a linha de código com ponto e vírgula prosseguindo neste laço vamos dar uma olhada linha produto e as variáveis de somatória continua igual laço que percorre os registros de pedidos vamos ver linha produto coluna sete diferente de vazio Ok faz as somatórias aqui está OK não precisa ajustar nada neste if pessoal nós vamos fazer.
O seguinte agora vai ser um pouco diferente a linha nós não precisamos podem apagar esta parte e aqui nós trocamos primeiro o valor e depois a quantidade aqui está ó total e qtd então eu vou trocar esta ordem o total valor vai ser na segunda coluna vírgula e esta última vírgula eu vou apagar feito estes ajustes Nós já vamos ter uma tabelinha para montar o gráfico de pizza no entanto pessoal para não ficar um vídeo muito extenso e também separar os conteúdos nós vamos fazer a função.
Veja Também:
- Formulário de Avaliação de Desempenho para Liderados em PDF
- Pacote de Planilhas para Fretes Fracionados
- 8 MODELOS CERTIFICADOS WORD
Postar um comentário