Question

我正在为石油和天然气行业编写一个程序，让您可以使用现场的远程逻辑板查看泵插孔是打开还是关闭，然后通过4G互联网传输信息。我正在尝试以地图上的图标为红色或绿色的方式构建它，具体取决于电路板上的警报是否被触发。可以通过静态IP访问警报的文件路径，例如：

http://111.111.111.111/var/rmsdata/alarm1

此文件路径的值为1或0

如何将0或1的值转换为if语句，该语句会根据值更改图标？

以下是其中一个图标的代码：

 function initialize() {


        var map_canvas = document.getElementById('map_canvas');
        var map_options = {
          center: new google.maps.LatLng(50.242913, -111.195383),
          zoom: 14,
          mapTypeId: google.maps.MapTypeId.TERRAIN


        } 
        var map = new google.maps.Map(map_canvas, map_options);

        var point       =       new google.maps.LatLng(47.5, -100); 
        var derrick1    =       new google.maps.Marker ({
            position: new google.maps.LatLng(50.244915, -111.198540),    
            map: map,
            icon: 'on.png',
            size: new google.maps.Size(20, 32),
            title: '1' 

        })



        google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

我正在为给定的URL做一个简单的Ajax请求，并在响应上建立图标。此代码未经过测试，我可以对其进行大量改进。但它可能会指向正确的方向。

function initialize() {
    var url = 'http://111.111.111.111/var/rmsdata/alarm1';
    var map_canvas = document.getElementById('map_canvas');
    var map_options = {
        center: new google.maps.LatLng(50.242913, -111.195383),
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };
    var map = new google.maps.Map(map_canvas, map_options);

    // Make an ajax request for the url that you specified above and base your icon on the response.
    $.get(url, function(response) {
        var on = true;

        if (isNaN(response)) {
            // If the response would contain anything else but a number.
            console.log('Response is not a number, defaults to "on"');
        } else {
            // Converts the "0" to "false" and anything else to "true".
            on = !!+response;
        }

        var point = new google.maps.LatLng(47.5, -100);
        var derrick1 = new google.maps.Marker({
            position: new google.maps.LatLng(50.244915, -111.198540),
            map: map,
            icon: (on) ? 'on.png' : 'off.png', // Shorthand if-statement to determine the icon. Also called Ternary Operator.
            size: new google.maps.Size(20, 32),
            title: '1'

        })
    });

    google.maps.event.addDomListener(window, 'load', initialize);
}

使用Google地图中的“if”语句更改图标

1 个答案: