javascript - Highcharts Gauge - 如何从文件读取输入？

Question

我目前刚刚开始使用 JS，需要一个项目的 highcharts，到目前为止一切顺利，但我确实有一个非常新手的问题:我有一些任务执行 cron 作业并将值范围:10-90 输出到文件。如何将值加载到仪表中？

这是我改编的代码(范围、外观和感觉并不重要)，我只能制作一个静态值53.8:

 $(function () {

    $('#container').highcharts({

        chart: {
            type: 'gauge',
            plotBackgroundColor: null,
            plotBackgroundImage: null,
            plotBorderWidth: 0,
            plotShadow: false
        },

        title: {
            text: 'Speedometer'
        },

        pane: {
            startAngle: -150,
            endAngle: 150,
            background: [{
                backgroundColor: {
                    linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                    stops: [
                        [0, '#FFF'],
                        [1, '#333']
                    ]
                },
                borderWidth: 0,
                outerRadius: '109%'
            }, {
                backgroundColor: {
                    linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                    stops: [
                        [0, '#333'],
                        [1, '#FFF']
                    ]
                },
                borderWidth: 1,
                outerRadius: '107%'
            }, {
                // default background
            }, {
                backgroundColor: '#DDD',
                borderWidth: 0,
                outerRadius: '105%',
                innerRadius: '103%'
            }]
        },

        // the value axis
        yAxis: {
            min: 0,
            max: 200,

            minorTickInterval: 'auto',
            minorTickWidth: 1,
            minorTickLength: 10,
            minorTickPosition: 'inside',
            minorTickColor: '#666',

            tickPixelInterval: 30,
            tickWidth: 2,
            tickPosition: 'inside',
            tickLength: 10,
            tickColor: '#666',
            labels: {
                step: 2,
                rotation: 'auto'
            },
            title: {
                text: 'km/h'
            },
            plotBands: [{
                from: 0,
                to: 120,
                color: '#55BF3B' // green
            }, {
                from: 120,
                to: 160,
                color: '#DDDF0D' // yellow
            }, {
                from: 160,
                to: 200,
                color: '#DF5353' // red
            }]        
        },

        series: [{
            name: 'Speed',
            data: [80],
            tooltip: {
                valueSuffix: ' km/h'
            }
        }]

    }
);
    $('#container').highcharts().series[0].points[0].update(50.8)
});

这是 jsfiddle 链接:http://jsfiddle.net/H8uGk/ ，你们能给我一些如何读取文件内容的提示吗？ (本例中为数字)

有什么方法可以用 JavaScript 实现吗？它不需要是动态的，而且我避免使用 php。

谢谢，

Answer 1

最简单的方法是将其复制/粘贴到您的 js 文件中，我认为这还不够好，因为您希望它是动态的。

如果你需要它是动态的，你不能在javascript中这样做，因为javascript运行在客户端(即网络浏览器)上，但它需要从服务器(即原始机器)读取。因此，您必须创建一个“端点”来读取文件，在 php 中查看一些简单的内容，如下所示:

<?php
// > PHP 5
$file = file_get_contents('./gauge_data.txt', FILE_USE_INCLUDE_PATH);
?>