如何从 server/url 中提取 json 数据并设置为变量？

Question

我目前有一个来自 highcharts 的仪表图，它处理我直接输入的数据，但现在我正在尝试过渡到从通过 [=17= 托管的服务器中提取数据（json fromat） ] 这是我目前拥有的图表 https://jsfiddle.net/IzzyStrauch/9zuewk18/18/

series: [
      {
        name: "Speed",
        data: [85],
        tooltip: {
          valueSuffix: " RPM"
        }
      }
    ],

我目前正在尝试找出一种方法来将系列的数据部分设置为 http://localhost:8000/f0s 看起来像这样

[
  55
]

并让它每 3 秒实时更新一次，我知道我可以通过 enablePolling: true 做到这一点，但我无法让它只从 url.[=20= 中提取静态数字 55 ]

if (!chart.renderer.forExport) {
      setInterval(function () {
        var lg = 50;
        var hg = 120;
        var point = chart.series[0].points[0],
          axis = chart.yAxis[0];

        axis.update({
          plotBands: [
            {
              from: 0,
              to: lg,
              color: "red" // green
            },
            {
              from: lg,
              to: hg,
              color: "green" // yellow
            },
            {
              from: hg,
              to: 200,
              color: "red" // red
            }
          ]
        });
      }, 3000);
    }
  }

然后我想将变量 lg 设置为 http://localhost:8000/f0lg 并将 hg 设置为 http://localhost:8000/f0hg
lg 看起来像这样

[
  30
]

hg 看起来像这样

[
  70
]

而且我希望每 3 秒从 url 中拉出那些

关于这怎么可能的任何想法？

使用经过检查的解决方案，我现在可以输入和更改图表中的所有变量，但刻度线都不稳定这是新代码 https://jsfiddle.net/IzzyStrauch/1rx3tyjp/9/

（出于某种原因，它适用于 jsfidle，但不适用于我使用它的代码，但它完全相同，只是我的 page/code 上有更多图表）想知道为什么会这样吗？

Answer 1

查看演示如何获取 JSON 数据和初始化图表的演示：https://jsfiddle.net/BlackLabel/rdn4fyb7/

fetch("https://api.npoint.io/6f74f002ed847e39cc3c")
  .then(response => response.json())
  .then(data => {
    //check how the fetched data looks like
    console.log(data)

    //create chart
    Highcharts.chart('container', {

      series: [{
                type: 'column',
        data: data.data
      }]
    });
  });

如何从 server/url 中提取 json 数据并设置为变量？

how to pull json data from a server/url and set equal to a variable?

javascript

json

highcharts

json-server