从JSON到Highcharts的温度

huangapple go评论91阅读模式
英文:

Temperature from JSON to Highcharts

问题

我有以下的代码,我想从JSON文件中实现温度,但是我不知道我在做什么错。

我尝试了不同的JSON文件配置,没有将其分为温度和露点(dew),但仍然一样。这个结果没有答案...

Highcharts.getJSON(
    'https://www.pogodakrotoszyn.info/tempdata.json',
    function (data->temp) {

        Highcharts.chart('container', {
            chart: {
                zoomType: 'x'
            },
            title: {
                text: '温度',
                align: 'left'
            },
            subtitle: {
                text: document.ontouchstart === undefined ?
                    '单击并拖动绘图区域进行缩放' : '捏图表以放大',
                align: 'left'
            },
            xAxis: {
                type: 'datetime'
            },
            yAxis: {
                title: {
                    text: '温度'
                }
            },
            legend: {
                enabled: false
            },
            plotOptions: {
                area: {
                    fillColor: {
                        linearGradient: {
                            x1: 0,
                            y1: 0,
                            x2: 0,
                            y2: 1
                        },
                        stops: [
                            [0, Highcharts.getOptions().colors[0]],
                            [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                        ]
                    },
                    marker: {
                        radius: 2
                    },
                    lineWidth: 1,
                    states: {
                        hover: {
                            lineWidth: 1
                        }
                    },
                    threshold: null
                }
            },

            series: [{
                type: 'area',
                name: '温度',
                data: data->temp;
            }]
        });
    }
);

希望这有帮助。

英文:

I have code like below, I want to implement temperature on it from JSON file, however I don't know what I am doing wrong.

I tried different configurations of the JSON file itself, without the division into temperature and dew point (dew), but still the same. This result gives no answer...

Highcharts.getJSON(
'https://www.pogodakrotoszyn.info/tempdata.json',
function (data->temp) {
Highcharts.chart('container', {
chart: {
zoomType: 'x'
},
title: {
text: 'Temperature',
align: 'left'
},
subtitle: {
text: document.ontouchstart === undefined ?
'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in',
align: 'left'
},
xAxis: {
type: 'datetime'
},
yAxis: {
title: {
text: 'Temperature'
}
},
legend: {
enabled: false
},
plotOptions: {
area: {
fillColor: {
linearGradient: {
x1: 0,
y1: 0,
x2: 0,
y2: 1
},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
marker: {
radius: 2
},
lineWidth: 1,
states: {
hover: {
lineWidth: 1
}
},
threshold: null
}
},
series: [{
type: 'area',
name: 'Temperature',
data: data->temp;
}]
});
}
);

答案1

得分: 1

问题在于你在JavaScript代码中使用了PHP语法来访问对象的属性。不应该使用 data->temp,而应该像这样使用 data.temp

Highcharts.getJSON(
    'https://www.pogodakrotoszyn.info/tempdata.json',
    function (data) {

        Highcharts.chart('container', {
            ...
            series: [{
                type: 'area',
                name: 'Temperature',
                data: data.temp
            }]
        });
    }
);

演示: https://jsfiddle.net/BlackLabel/sypfmn10/
MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects

英文:

The problem is that in the JavaScript code you use PHP syntax to access property of the object. Instead of data->temp you should do it like this data.temp.

Highcharts.getJSON(
'https://www.pogodakrotoszyn.info/tempdata.json',
function (data) {
Highcharts.chart('container', {
...
series: [{
type: 'area',
name: 'Temperature',
data: data.temp
}]
});
}
);

Demo: https://jsfiddle.net/BlackLabel/sypfmn10/<br/>
MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects

huangapple
  • 本文由 发表于 2023年3月7日 22:37:29
  • 转载请务必保留本文链接:https://go.coder-hub.com/75663358.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定