首页 > 解决方案 > 从实时 Fixer api 货币数据填充 Highchart 折线图

问题描述

嗨,我对 highcharts 完全陌生,对 JavaScript 有基本的了解。

http://data.fixer.io/api/latest?access_key=b74dda0c99e32e39b8eb5aebaa199d1d&symbols=GBP&format=1

以下链接可以访问我的实时 JSON 数据。

我已经使用静态数据创建了基本图表,但我正在寻找图表来读取 API 文件而不是静态日期。

理想情况下,图表应每小时更新欧元和英镑的值,以显示 24 小时内的当前汇率。

以下代码是我的静态大纲

<body>
<div id="container"></div>
<script>
Highcharts.chart('container', {
    title: {
        text: 'Chart example'
    },
    xAxis: {


    },
    series: [{
        name: 'Pound Sterling (£)',
        data: [1.112, 1.124, 1.119, 1.121, 1.123, 1.117, 1.113]
    }, {
        name: 'Euro (€)',
        data: [1.101, 1.126, 1.112, 1.131, 1.124, 1.135, 1.101]
    }, 
    ],
    yAxis: {
        title: {
            text: 'Currency Value'
        }
    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'middle'
    },
    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    layout: 'horizontal',
                    align: 'center',
                    verticalAlign: 'bottom'
                }
            }
        }]
    }
});
</script>

标签: apihighcharts

解决方案


推荐阅读