Gráficos são elementos bastante utilizados para apresentar informações de uma maneira mais compreensível e amigável, eles são indicados principalmente quando trabalham com dados numéricos. Sua utilização na IDE se dá através da combinação entre os blocos de programação da categoria gráfico e o componente visual gráfico, e eles são os responsáveis, respectivamente, por criar um gráfico e o renderiza-lo em uma view HTML.
Configuração
Será feito em etapas, primeiramente adicionando o componente na IDE e, após, desenvolvendo uma programação simples utilizando o bloco gráfico onde o mesmo utilizará dados de um banco.
Criando uma entidade no banco
Adicione uma classe no diagrama - nesse exemplo, vai ser utilizado a classe anime;
Crie atributos para essa classe, como anime (tipo texto), genero (tipo texto), episódios (tipo inteiro) e ano (tipo texto) (Figura 1.1);
Faça a persistência da classe clicando com o botão direito do mouse sobre a classe e selecionando criar camada de dados para a entidade(Figura 1.1);
Crie o formulário da classe clicando com o botão direito do mouse sobre a classe e selecionando criar visão para a entidade (Figura 1.1).
Figura 1.1 - Criar persistência e visão para a entidade