google-maps - Onion.js 中的 Google map 脚本错误-6ren

google-maps - Onion.js 中的 Google map 脚本错误

转载作者：行者123 更新时间：2023-12-04 00:12:48

今天早上我刚开始收到谷歌地图脚本错误。

线路:0
字符:0
错误:脚本错误
代码:0
网址:

我将所有代码更改恢复到早期版本，但它仍然存在。

我将包含下面的脚本，但我必须提到它在与 IE 接口(interface)的 Delphi TWebBrowser 中运行。

我可以运行我的程序，与页面交互，然后让它闲置。大约 20 秒后，在没有任何用户交互的情况下，我得到了上面的持续错误。当我关闭错误消息框时，它会立即打开并显示相同的消息。

我已经为这个项目工作了几个月，现在开始了。我已经回滚了几个版本，但它仍然存在。

我从哪里开始寻找？

<html>
  <head>
    <title>Find your Qtr minute locator</title>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?api=AIzaSyAa7YZpvi09ig92s_BLP2H3QVLTmoqdcQQ&amp;v=3.exp&amp;libraries=geometry&amp;sensor=false"></script>
  </head>
  <body><!-- Declare the div, make it take up the full document body -->
    <div id="map-canvas" style="HEIGHT: 100%; WIDTH: 100%"></div>
    <script type="text/javascript">
    var map;
    var idx = 0;
    var qtrArray = [];
    var userGridArray = [];
    var Startlatlng = "";
    var llOffset = 0.00416666666667;
    var babyOffset = (llOffset/2);  // offsets gridSelector 1/2 qtr min
    var drawGridSelectBox = false;
    var findNeighbor = false;
    var firstRun = true;
    var drawGridBox = false;
    var deSelectOn = false;
    var GridSelect = false;
    var gridOverBox = new google.maps.Polygon();
    var gridSelectBox = new google.maps.Polygon();

    var gridline;
    var polylinesquare;
    var latPolylines = [];
    var lngPolylines = [];
    var lngLabels = [];
    var otherColor =  "#128A00";
    var bounds = new google.maps.LatLngBounds();

    function initialize() {
        map = new google.maps.Map(document.getElementById("map-canvas"), {
            center: new google.maps.LatLng(34.0, -84.0),
            zoom: 14,
            streetViewControl: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            scaleControl: true
        });

        google.maps.event.addListener(map, "click", function (event) {
            if (!google.maps.geometry.poly.containsLocation(event.latLng, gridSelectBox)) {
                map.setZoom(14);
              if (findNeighbor)
                MarkArea(event.latLng.lat(), event.latLng.lng());
                if (drawGridSelectBox) {
                  createGridSelectBox(event.latLng);
                  GridSelect = !firstRun;
                    if (!GridSelect) {
                        ClearGrid()
                    }
                }

                for(var xx=0;xx<latPolylines.length;++xx){
                    for(var yy=0;yy<lngPolylines.length-1;++yy){
                        var latLng=new google.maps.LatLng(latPolylines[xx].getPath().getAt(0).lat(),
                                lngPolylines[yy].getPath().getAt(0).lng());

                        if ((google.maps.geometry.poly.containsLocation(latLng, gridSelectBox))&&(!firstRun))
                        {
                            drawGridBox = true;
                            createGridBox(latLng);
                        }
                    }
                }
                firstRun = false;
                map.panTo(event.latLng);
                drawGridBox = false;

            }});

        DrawGridOn();
        google.maps.event.addListener(map, "idle", function () {
            createGridLines(map.getBounds());
        });
    }  // initialize

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

    function createGridLines(bounds) {
        for (var i = 0; i < latPolylines.length; i++) {
            latPolylines[i].setMap(null);
        }

        latPolylines = [];
        for (var j = 0; j < lngPolylines.length; j++) {
            lngPolylines[j].setMap(null);
        }
        lngPolylines = [];

        for (var k = 0; k < lngLabels.length; k++) {
            lngLabels[k].setMap(null);
        }
        lngLabels = [];

        if (map.getZoom() < 10) return;
        var north = bounds.getNorthEast().lat();
        var east  = bounds.getNorthEast().lng();
        var south = bounds.getSouthWest().lat();
        var west  = bounds.getSouthWest().lng();

    // define the size of the grid
        var topLat    = Math.ceil(north / llOffset) * llOffset;
        var rightLong = Math.ceil(east / llOffset) * llOffset;

        var bottomLat = Math.floor(south / llOffset) * llOffset;
        var leftLong  = Math.floor(west / llOffset) * llOffset;


        var qtrNELatLngCode = ddToQM(topLat, rightLong);
        var qtrNorth = qtrNELatLngCode.substring(0, 5);
        var qtrEast = qtrNELatLngCode.substring(5, 12);
        var qtrSWLatLngCode = ddToQM(bottomLat, leftLong);
        var qtrSouth = qtrSWLatLngCode.substring(0, 5);
        var qtrWest = qtrSWLatLngCode.substring(5, 12);

        for (var latitude = bottomLat; latitude <= topLat; latitude += llOffset) latPolylines.push(new google.maps.Polyline({
            path: [
                new google.maps.LatLng(latitude, leftLong), new google.maps.LatLng(latitude, rightLong)],
            map: map,
            geodesic: true,
            strokeColor: "#0000FF",
            strokeOpacity: 0.1,
            strokeWeight: 1
        }));
        for (var longitude = leftLong; longitude <= rightLong; longitude += llOffset) lngPolylines.push(new google.maps.Polyline({
            path: [
                new google.maps.LatLng(topLat, longitude), new google.maps.LatLng(bottomLat, longitude)],
            map: map,
            geodesic: true,
            strokeColor: "#0000FF",
            strokeOpacity: 0.1,
            strokeWeight: 1
        }));

        if (map.getZoom() < 15) {
            for (var l = 0; l < lngLabels.length; l++) {
                lngLabels[l].setMap(null);
            }
            lngLabels = [];
            return;
        }  // set lngLabels to null

        for(var x=0;x<latPolylines.length;++x){
            for(var y=0;y<lngPolylines.length-1;++y){
                var latLng=new google.maps.LatLng(latPolylines[x].getPath().getAt(0).lat(),
                        lngPolylines[y].getPath().getAt(0).lng());

                var qtrLatLng = ddToQM(latLng.lat(), latLng.lng());

                lngLabels.push(new google.maps.Marker({
                    map:map,
                    position:latLng,
                    icon:{  url:"https://chart.googleapis.com/chart?"
                    +"chst=d_bubble_text_small&chld=bb|"
                    + qtrLatLng
                    +"|FFFFFF|000000",
                        anchor:new google.maps.Point(0,42)
                    }
                }));
            }
        }
        external.ShowQtrMinBounds(qtrNorth, qtrSouth, qtrEast, qtrWest);
    }  // end createGridLines

    function createGridSelectBox(point) {
    // Square limits
        var smPoint = point;

        var bottomLeftLat  = (Math.floor(point.lat() / llOffset) * llOffset) - babyOffset;
        var bottomLeftLong = (Math.floor(point.lng() / llOffset) * llOffset) - babyOffset;


        var gridLineSquare = [
            new google.maps.LatLng(bottomLeftLat, bottomLeftLong),  //lwr left
            new google.maps.LatLng(bottomLeftLat, bottomLeftLong + llOffset),  //lwr right
            new google.maps.LatLng(bottomLeftLat + llOffset, bottomLeftLong + llOffset),  //upr right
            new google.maps.LatLng(bottomLeftLat + llOffset, bottomLeftLong)];  //upr left
    //auto-complete to lwr left

        if (drawGridSelectBox == true) {
            gridSelectBox = new google.maps.Polygon({
                path: gridLineSquare,
                draggable:true,
                geodesic:true,
                editable :true,
                fillColor: "#FF0000",
                fillOpacity: 0.35,
                strokeColor: "#CC0099",
                strokeOpacity: 0.1,
                strokeWeight: 1
            });

            gridSelectBox.setMap(map);
            drawGridSelectBox = false;
        }
    }

    function MarkArea(Lat, Lng) {
        var latLng = new google.maps.LatLng(Lat,Lng);
        drawUserGrids(latLng);
    }

    function SaveQtrMin(){
                for (var m in qtrArray) {
                    external.SaveQtrMinutes(qtrArray[m].qtrMinute);
                }
    }

     function DrawGridOn() { //creates GridSelectBox
        addGridOn = false;
        drawGridSelectBox = true;
        firstRun = true;
    }

    function DrawGridOff() {
            gridSelectBox.setMap(null);
            drawGridSelectBox = false;
    }

    function GotoLatLng(Lat, Lng) {
            var latlng = new google.maps.LatLng(Lat,Lng);
            map.setCenter(latlng);
    }

    function DeSelectOn(){
        deSelectOn = true;
        addGridOn = false;
    }

    function DeSelectOff(){       // Allows removing 1 QtrMin
        deSelectOn = false;
    }

    function AddGridOn(){        // Allows adding 1 QtrMin
        addGridOn = true;
        deSelectOn = false;
    }

    function AddGridOff(){
        addGridOn = false;
    }

    function ClearGrid() {
        if (qtrArray) {
            for (var i in qtrArray) {
                qtrArray[i].setMap(null);
            }
        }
        qtrArray=[];
        idx = 0;
    }

    function ClearUserGrid() {
        if (userGridArray) {
            for (var i in userGridArray) {
                userGridArray[i].setMap(null);
            }
        }
        userGridArray=[];
    }

    function drawUserGrids(point) {
    // Square limits

        var bottomLeftLat = (Math.floor(point.lat() / llOffset) * llOffset);
        var bottomLeftLong = (Math.floor(point.lng() / llOffset) * llOffset);

        var gridLineSquare = [
            new google.maps.LatLng(bottomLeftLat, bottomLeftLong),  //lwr left
            new google.maps.LatLng(bottomLeftLat, (bottomLeftLong + llOffset)),  //lwr right
            new google.maps.LatLng((bottomLeftLat + llOffset), (bottomLeftLong + llOffset)),  //upr right
            new google.maps.LatLng((bottomLeftLat + llOffset), bottomLeftLong)];  //upr left


        drawGridBox = true;

        if (drawGridBox == true) {

            gridUserArea = new google.maps.Polygon({
                path: gridLineSquare,
                draggable:false,
                geodesic:true,
                editable :false,
                fillColor:otherColor,
                fillOpacity: 0.35,
                strokeColor: "#CC0099",
                strokeOpacity: 0.1,
                strokeWeight: 1
            });

            gridUserArea.setMap(map);
            userGridArray.push(gridUserArea);
        }
    }

     function createGridBox(point) {
        // Square limits
        var arrayIdx = 0;
        var addListenersOnPolygon = function(polygon) {
            google.maps.event.addListener(polygon, 'click', function (event) {
                if (deSelectOn==true) {
                arrayIdx = qtrArray.indexOf(polygon);
                qtrArray.splice(arrayIdx,1);
                polygon.setMap(null);
                }
            });
        };
        var smPoint = point;

        var bottomLeftLat = (Math.floor(point.lat() / llOffset) * llOffset);
        var bottomLeftLong = (Math.floor(point.lng() / llOffset) * llOffset);


        var gridLineSquare = [
            new google.maps.LatLng(bottomLeftLat, bottomLeftLong),  //lwr left
            new google.maps.LatLng(bottomLeftLat, (bottomLeftLong + llOffset)),  //lwr right
            new google.maps.LatLng((bottomLeftLat + llOffset), (bottomLeftLong + llOffset)),  //upr right
            new google.maps.LatLng((bottomLeftLat + llOffset), bottomLeftLong)];  //upr left
        drawGridBox = true;

        if (drawGridBox == true) {
            gridOverBox = new google.maps.Polygon({
                path: gridLineSquare,
                draggable:false,
                geodesic:true,
                editable :false,
                fillColor: "#EAED00",
                fillOpacity: 0.35,
                strokeColor: "#CC0099",
                strokeOpacity: 0.1,
                strokeWeight: 1,
                qtrMinute : ddToQM(bottomLeftLat, bottomLeftLong),
                indexID : ++idx
            });

            gridOverBox.setMap(map);
            addListenersOnPolygon(gridOverBox);
            qtrArray.push(gridOverBox);
        }
    }

    function ddToQM(alat, alng) {
        var latResult, lngResult, dmsResult;

        alat = parseFloat(alat);
        alng = parseFloat(alng);

        latResult = "";
        lngResult = "";

        latResult += getDms(alat);
        lngResult += getDms(alng);

        dmsResult = latResult + lngResult;

        // Return the resultant string.
        return dmsResult;
    }

    function toggleGridSelection(){
        GridSelect = true;//(!!GridSelect);
    }

    function findNeighborOn(){
        findNeighbor = true;
        otherColor = randColor();
    }

    function findNeighborOff(){
        findNeighbor = false;
        otherColor =  "#128A00";
    }

    function randColor() {
       var i;
       var colorArray = ["#B2A209","#A4A07B","#B02600","#6CA200","#BC0072","#B1ADFF","#16CADB","#A1FFD1","#9999CC","#EEFF7C"];

       i = Math.floor((Math.random() *10)+1);
       return colorArray[i];
    }

    function getDms(val) {
    // Required variables
        var valDeg, valMin, valSec, interimResult;
        var qtrMin;
        val = Math.abs(val);

    // ---- Degrees ----
        valDeg = Math.floor(val);
        valMin = Math.floor((val - valDeg) * 60);
        valSec = Math.round((val - valDeg - valMin / 60) * 3600 * 1000) / 1000;

        if (valSec == 60){
            valMin +=1;
            valSec = 0;
        }
        if (valMin == 60){
            valMin +=1;
            valSec = 0;
        }
        interimResult = valDeg+"";

        if (valMin<10){
            valMin = "0"+valMin;
        }
        interimResult += valMin + "";

        switch(valSec){
            case  0 : qtrMin = "A";
                break;
            case 15 : qtrMin = "B";
                break;
            case 30 : qtrMin = "C";
                break;
            case 45 : qtrMin = "D";
                break;

        }
        interimResult += qtrMin;
        return interimResult;
    }

</script>
  </body>
</html>

最佳答案

在标题部分添加以下元标记为我解决了这个问题。

 <meta http-equiv="X-UA-Compatible" content="IE=edge">

X-UA-Compatible 元标记允许网络作者选择什么
页面应呈现为的 Internet Explorer 版本。

边缘模式告诉 Internet Explorer 以最高模式显示内容
可用的。

关于google-maps - Onion.js 中的 Google map 脚本错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33974901/

文章推荐： amazon-web-services - API网关的ARN角色以启用日志错误

node.js - backbone.js + node.js - express.js
我正在学习构建单页应用程序 (SPA) 所需的所有技术。总而言之，我想将我的应用程序实现为单独的层，其中前端仅使用 API Web 服务(json 通过 socket.io)与后端通信。前端基本上是
node.js - Sequelize js/express js/node js 如何更改日期格式
当我看到存储在我的数据库中的日期时。这是正常。日期和时间就是这样。但是当我运行 get 请求来获取数据时。此格式与存储在数据库中的格式不同。为什么会发生这种情况？最佳答案我认为您可以将
history.js - Sammy.js/History.js/Nav.js 之间的比较
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
backbone.js - Mustache.js/Hogan.js 和 Backbone.js
我正在尝试使用backbone.js 实现一些代码和 hogan.js (http://twitter.github.com/hogan.js/) Hogan.js was developed ag
node.js - Backbone.js Node.js Express.js 中的用户功能
我正在使用 Backbone.js、Node.js 和 Express.js 制作一个 Web 应用程序，并且想要添加用户功能(登录、注销、配置文件、显示内容与该用户相关)。我打算使用 Passpor
node.js - Angular.js/D3.js/Node.js 之间有什么区别和相似之处
关闭。这个问题需要多问focused 。目前不接受答案。想要改进此问题吗？更新问题，使其仅关注一个问题 editing this post . 已关闭 8 年前。 Improve this ques
node.js - d3.js、queue.js 和 node.js
我尝试在 NodeJS 中加载数据，然后将其传递给 ExpressJS 以在浏览器中呈现 d3 图表。我知道我可以通过这种方式加载数据 - https://github.com/mbostock/q
node.js - node.js 中 app.js、index.js 和 server.js 的约定？
在 node.js 中，我似乎遇到了相同的 3 个文件名来描述应用程序的主要入口点: 使用 express-generator 包时，会创建一个 app.js 文件作为生成应用的主要入口点。通过 n
backbone.js - amplify.js 和backbone.js
最近，我有机会观看了 john papa 关于构建单页应用程序的精彩类(class)。我会喜欢的。它涉及服务器端和客户端应用程序的方方面面。我更喜欢客户端。在他的实现过程中，papa先生在客户端有类
backbone.js - Mustache.js、Handlebars.js 和 Underscore.js 有什么区别？
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
d3.js - Pixi.js vs Konva.js vs D3.js
我是一个图形新手，需要帮助了解各种 javascript 2D 库的功能。 . . 我从 Pixi.js 中得到了什么，而我没有从 Konva 等基于 Canvas 的库中得到什么？我从 Konva
node.js - Ember.js:将选项传递给node.js
我正在尝试将一些 LESS 代码(通过 ember-cli-less)构建到 CSS 文件中。 1) https://almsaeedstudio.com/ AdminLTE LESS 文件2) Bo
node.js - 尝试在 Express.js Node.js Passport.js 中查看所有登录用户
尝试查看 Express Passport 中所有登录用户的所有 session ，并希望能够查看当前登录的用户。最好和最快的方法是什么？我在想也许我可以在登录时执行此操作并将用户模型数据库“在线”
node.js - React.js 渲染完成后运行客户端 JS
我有一个 React 应用程序，但我需要在组件加载完成后运行一些客户端 js。一旦渲染函数完成并加载，运行与 DOM 交互的 js 的最佳方式是什么，例如 $('div').mixItUp() 。对
node.js - 使用 vue.js、node.js 和express.js 上传原始文件
请告诉我如何使用bodyparser.raw()将文件上传到express.js服务器客户端 // ... onFilePicked(file) { const url = 'upload/a
node.js - 由于 js 错误过多，Gulp.js 无法编译 angular.js 项目？
我正在尝试从 Grunt 迁移到 Gulp。这个项目在 Grunt 下运行得很好，所以我一定是在 Gulp 中做错了什么。除脚本外，所有其他任务均有效。我现在厌倦了添加和注释部分。我不断收到与意外
node.js - sails.js(使用 node.js 和 express.js)的标题或应用名称在哪里？
我正在尝试更改我的网站名称。找不到可以设置标题或应用程序名称的位置。最佳答案您可以在 config/ 目录中创建任何文件，例如 config/app.js 包含如下内容: module.expor
node.js - 将 ember.js 与 node.js + express.js 结合使用
经过多年的服务器端 PHP/MySQL 开发，我正在尝试探索用于构建现代 Web 应用程序的新技术。我正在尝试对所有 JavaScript 内容进行排序，如果我理解得很好，一个有效的解决方案可以是服
node.js - Node.js 中 app.js 和 index.js 的区别
我是 Nodejs 的新手。我在 route 目录中有一个 app.js 和一个 index.js。我有一个 app.use(multer....)。我还定义了 app.post('filter-re
javascript - AngularJS 种子 : putting JavaScript into separate files (app. js、controllers.js、directives.js、filters.js、services.js)
我正在使用 angular-seed用于构建我的应用程序的模板。最初，我将所有 JavaScript 代码放入一个文件 main.js。该文件包含我的模块声明、 Controller 、指令、过滤器和

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

google-maps - Onion.js 中的 Google map 脚本错误