AnswerBun.com

receber json para tornar o meu Echart dinamico

Stack Overflow em Português Asked by JoãoEs on January 2, 2022

Aqui esta imagem do grafico

 var echartLine = echarts.init(document.getElementById('echart_line'), theme);

  echartLine.setOption({
    title: {
      text: 'Line ',
      subtext: 'Mes'
    },
    tooltip: {
      trigger: 'axis'
    },
    legend: {
      x: 220,
      y: 40,
      data: ['actions1', 'actions2', 'actions3']
    },
    toolbox: {
      show: true,
      feature: {
        magicType: {
          show: true,
          title: {
            line: 'Line',
            bar: 'Bar',
            stack: 'Stack',
            tiled: 'Tiled'
          },
          type: ['line', 'bar', 'stack', 'tiled']
        },
        restore: {
          show: true,
          title: "Restore"
        },
        saveAsImage: {
          show: true,
          title: "Save Image"
        }
      }
    },
    calculable: true,
    xAxis: [{
      type: 'category',
      boundaryGap: false,
     // scale:true,
     // splitNumber:12,

      data: ['Mon', Tue', 'Wed', 'Thu', 'Fri'] //Quero receber aqui em JSON
    }],
    yAxis: [{
      type: 'value'
    }],
    series: [{
      name: 'stuff',
      type: 'line',
      smooth: true,
      itemStyle: {
        normal: {
          areaStyle: {
            type: 'default'
          }
        }
      },
      data: [10, 12, 21, 54, 260, 830, 710] // Quero receber aqui em JSON
    }, {
      name: 'stuff',
      type: 'line',
      smooth: true,
      itemStyle: {
        normal: {
          areaStyle: {
            type: 'default'
          }
        }
      },
      data: [30, 182, 434, 791, 390, 30, 10]
    }, {
      name: 'things',
      type: 'line',
      smooth: true,
      itemStyle: {
        normal: {
          areaStyle: {
            type: 'default'
          }
        }
      },
      data: [1320, 1132, 601, 234, 120, 90, 20]
    }]
  });

Como posso receber ali no “data” o meu array com as querys vindas do PHP para tornar o meu gráfico dinamico? Estou a necessitar urgentemente de ajuda. Até hoje utilizei pouco o JSON. Obrigado

2 Answers

Dá uma olhada nesse link: https://codepen.io/andr-menezes/pen/EdLJMe, utilizei esse Pen pra implementar o Echarts com Json no meu projeto. No meu caso eu gero um arquivo json e leio o mesmo exibindo os dados no gráfico.

Answered by Andre Menezes on January 2, 2022

Tudo depende de como você está disponibilizando essa informação no PHP.

Um jeito simples seria adicionar uma chamda a jQuery.get() que busque essas informações.

var echartLine = echarts.init(document.getElementById('echart_line'), theme),
    chartData;

// Faz a chamada ao servidor para buscar os dados do PHP
$.get('/caminho/da/url.php', {dataType: 'json'}, function(retorno) {
    chartData = retorno;
});
...
data: chartData

e no PHP você processa os dados e retorna com:

$dados = array(); // aqui um array com os dados que você precisa
header('Content-Type: application/json');
echo json_encode($dados);
exit();

Answered by Ricardo Moraleida on January 2, 2022

Add your own answers!

Related Questions

Configuração do Flutter web e Firebase

1  Asked on November 25, 2021

     

Listar o nome de todos objetos dentro do array

1  Asked on November 25, 2021 by guickz

       

Diferenças entre declarações de variáveis em C#

2  Asked on November 25, 2021 by rodolpho-chagas

     

Se C/C++ são linguagens nativas então por que precisam de runtimes?

1  Asked on November 25, 2021 by samuel-ives

   

Função Keyboard.dismiss() não funciona

1  Asked on November 25, 2021 by wander

   

Definir uma ordem especifica na query

2  Asked on November 25, 2021

 

O que significa Trying to get property non-object

0  Asked on November 25, 2021 by user198451

     

Como alterar o valor de um objeto dentro do array com Formik e Yup?

1  Asked on November 25, 2021 by bruno-elias-de-souza

     

Não estou conseguindo abrir outro Form do PyQt5

1  Asked on November 22, 2021 by nadson-alexandre

     

node js não renderiza o estilo css da página

1  Asked on November 22, 2021 by luiz-couto

     

Mapeamento de entidade oneToMany com Fluent NHibernate

1  Asked on November 20, 2021 by marllon-nasser

       

Problema ao inserir objeto com ManyToOne JPA

1  Asked on November 20, 2021 by codigoalvo

   

Abrir POST em arquivo php

1  Asked on November 19, 2021 by philip-vanstocher

   

Comparação de strings Javascript

1  Asked on November 19, 2021 by romeu-oliveira

 

Criar loop em templates com php

2  Asked on November 19, 2021 by alex-oliveira

         

Erro Angular NG Serve

2  Asked on November 19, 2021 by joo-roberto-velozo

 

Ask a Question

Get help from others!

© 2023 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP, SolveDir