Biblioteca FUScaBR


#1

Olá

Criei este tópico só para avisar que a versão 2.0 da biblioteca FUScaBR (Funções Úteis para o ScadaBR) já está disponível, agora no GitHub. Além da já conhecida capacidade de alinhar elementos na Representação Gráfica, esta versão da biblioteca agora também adiciona recursos como:

  • Adição de um sistema de templates prontos nos componentes HTML e script para servidor (e a biblioteca já vem com alguns modelos!)
  • Melhorias na capacidade de criação de gráficos: agora há suporte para gráficos de data points binários.
  • Ao utilizar o componente comparação de gráficos nas Representações Gráficas, a FUScaBR irá gerar um calendário para seleção rápida de datas (graças à integração com o flatpickr)
  • Suporte a internacionalização (atualmente só há traduções para português e inglês, tradutores são bem-vindos)

Quem desejar baixar a FUScaBR, o último lançamento pode ser encontrado aqui: https://github.com/celsou/fuscabr/releases/latest/


#2

Eu achei maravilhoso.
Essa grande contribuição deve ser recompensada.
Parabens Celso pela ajuda à comunidade.


#3

Ainda não testei mas já adorei

Bora esquentar a carcaça do tomcat aqui


#4

Eu baixei o FUscaBR Mas eu não estou vendo as diferenças no ScadaBR teria aredito que instalei certo mas teria como mostrar as diferenças dessa biblioteca


#5

Assim que eu tiver tempo eu vou tentar gravar um vídeo mostrando o que tem de novo na FUScaBR 2.0. Só para citar uma diferença: se tudo correu bem, tente editar uma Representação Gráfica e crie um componente script para o servidor. Você deve encontrar na janelinha de edição do script uma lista drop-down com vários “modelos” de scripts prontos. Quem gera essa lista é a FUScaBR.

FUScaBR


#6

Eu vi lá ficou bom Muito Obrigado vou usar essa versão ai do fuscabr 2.0


#7

Prezados, boa noite!

@Celso primeiramente gostaria de te parabenizar pela implementação da biblioteca. Realmente está sendo uma mão na roda pra apresentar os dados de maneira mais agradável aos olhos, principalmente dos clientes rs

Estou com uma dúvida, no entanto, a respeito do ajuste de um parâmetro do gráfico de linhas. Na minha aplicação, faço a leitura das tensões de um medidor de energia a cada minuto e quero apresentar esses dados no gráfico de linhas.
Primeiramente o gráfico preenchia o espaço entre a linha e o eixo X, o que pra minha aplicação é ruim. Estudando a biblioteca Charts.js e quebrando um pouco a cabeça consegui mexer no script “FUScaBR Chart (latest values)” e desabilitar essa opção fill que pintava essa área.

No entanto, aparentemente por default, o script traz a marcação dos pontos de leitura com uma bolinha. Para gráficos com intervalo de leitura mais curto não atrapalha, mas no meu caso está deixando a visualização um pouco desagradável:

Olhando na Charts.js, acredito que tenho que adicionar o elemento “options” para modificar o parâmetro “pointStyle” para conseguir o efeito desejado:

Olhando o script achei que modificando a seguinte parte conseguiria o efeito desejado, mas não deu certo:

image

Portanto, gostaria de pedir o apoio da comunidade nessa questão. É bem possível que seja uma besteira de sintaxe, mas como não sou programador experiente em javaScript to apanhando um pouco ainda :sweat_smile:

Agradeço desde já pelo apoio!


#8

Boa tarde.

Infelizmente eu não estou com muito tempo sobrando para me dedicar à FUScaBR, então a parte de documentação da biblioteca ainda está por fazer… Mas, para tentar ajudar com o seu problema, passarei uma adaptação que provavelmente funcionará.

Primeiramente eu preciso esclarecer um pouco a estrutura da biblioteca quanto a essa parte de gráficos. O funcionamento ocorre desta forma: os scripts para servidor obtém dados do back-end sobre os data points e geram um código JSON invisível na página HTML. Esse código (que foi onde você tentou implementar a alteração) não gera o gráfico por si só. Ele apenas contém as informações necessárias para que o script do módulo de gráficos da FUScaBR (Chart) possa ler os dados e chamar o Chart.js, que faz o resto do trabalho.

Então, se queremos mudar a forma dos gráficos, temos que alterar o módulo da FUScaBR responsável por criá-los. Esse módulo está (por padrão) localizado em /resources/fuscabr/modules/minified/chart.js. Como esse é um arquivo minificado (isto é, o texto do código-fonte foi compactado para carregar mais rapidamente) eu recomendo que você primeiro edite o arquivo /resources/fuscabr/modules/chart.js, que contém exatamente o mesmo código, e depois use o código alterado para gerar um novo arquivo minificado neste site. Por fim, substitua o arquivo /resources/fuscabr/modules/minified/chart.js pelo novo arquivo minificado que você criou e limpe o cache do navegador.

Agora que eu já disse onde estão os arquivos a serem alterados, segue a alteração que deve ser feita. Você deve alterar a função createNewCharts() e adicionar a linha especificada na imagem abaixo:

Isto irá zerar o raio dos círculos de cada ponto, fazendo os mesmos desaparecerem.

Apenas algumas considerações:

  • O procedimento de remover os pontos do gráfico de linha aparentemente também desativa o pop-up que aparece ao passar o mouse sobre os pontos.
  • Se você estiver usando a versão mais antiga da FUScaBR (versão 1.0), a biblioteca inteira se resume a um único script fuscabr.js, então é esse arquivo que deve ser editado.

Espero ter ajudado. Abraços!


#9

@Celso, bom dia!

Deu certo! Seguem as imagens de como ficou após os ajustes que você sugeriu.

image

image

image

Sobre a observação do radius, coloquei = 1 e manteve esse formato contínuo da linha, mas permitindo a leitura dos pontos, então fica a dica caso alguém no futuro precise.

Agradeço demais pelo apoio!