E JS с использованием извлеченных данных json с диаграммой d3 - PullRequest
Новая
       13

E JS с использованием извлеченных данных json с диаграммой d3

0 голосов
/ 07 января 2020

* Впервые до express.

У меня есть index.ejs и script.js.

Мой скрипт просто получает некоторые данные JSON из API. 

const fetch = require("node-fetch");
const url = '...'

fetch (url)
    .then(response => {
        return response.json()
    })
    .then(data =>{
    console.log(data)
    })
    .catch(err => {
    })

Как мне go использовать эти возвращенные JSON данные для создания диаграммы на моей индексной странице с d3.

Я искал вокруг, но все еще в замешательстве. Любой совет будет очень полезным! Спасибо.

1 Ответ

1 голос
/ 07 января 2020

Итак, как обсуждалось в комментариях, проблема заключалась в том, что сервер возвращал в express framework nodejs

Так что в express коде необходимо вызывать API и получать данные, один раз мы получаем данные, которые нам нужны для отправки во внешний интерфейс.

Таким образом, для возврата данных во внешний интерфейс мы можем использовать res.send из express 

const fetch = require("node-fetch");
const url = '...'

fetch (url)
    .then(response => {
        return response.json()
    })
    .then(data =>{
    console.log(data)
     res.send(data)
    })
    .catch(err => {
    })

И в интерфейсе нам нужно получить доступ к этому API, как показано ниже 

const getData = async () => {
  try {
    const response = await fetch(url) // server url (express js route) example http://localhost:6000/api/getChartData
    if(response.ok){
      const  body = await response.json()
      console.log(body)
      // once you get the data you can create d3 chart
      return
    }
    const customError = {
      message: 'something went wrong'
    }
    throw customError
  }catch(error){
    console.log(error) 
    // put the error in  a variable  and display on the ui so the user know some error happened
  }
}
...