У меня возникла ошибка, когда я установил код JavaScript для API карт Google на странице MVC

Я работаю над приложением MVC, работающим с картами API Google, и я пишу свои коды на обычной HTML-странице, и он работает нормально, но когда я перемещаю эти коды в файл MVC Razor, это происходит из-за строковой ошибки,

это мой код

<head>
    <script src = "https://maps.googleapis.com/maps/api/js?Ket=API_KEY&callback=initMap">
    </script>
    <meta http-equiv = "content-type" content = "text/html; charset=UTF-8" />
    <style>
        .labels {
            color: red;
            background-color: white;
            font-family: "Lucida Grande", "Arial", sans-serif;
            font-size: 10px;
            font-weight: bold;
            text-align: center;
            width: 60px;
            border: 2px solid black;
            white-space: nowrap;
        }
    </style>
</head>

<body>
    <div id = "controls-polyline" style = "align-content:center">
    </div>
    <div id = "gmap-polyline">
        <div align = "center" id = "map" style = "width: 1000px; height: 700px;">
            <script type = "text/javascript">
                var locations = [
                  ['Place 1', 33.75586, 35.6628018, 10, '', ''],
                  ['Place 2', 36.7074804, 37.6878624, 8, '~/maps/images/p2.png', ''],
                  ['Place 3', 38.5708937, 34.6664307, 7, '~/maps/images/p3.png', 'https://www.google.com.sa/maps/place/Al+Sadhan+Stores/@38.6931256,34.7640829,14.75z/data=!4m8!1m2!2m1!1z2KfZhNiz2K_Yrdin2YYgIDE0!3m4!1s0x0:0x154b423825155cce!8m2!3d24.6934641!4d46.7713577'],
               ];

                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 11,
                    center: new google.maps.LatLng(33.75586, 35.6628018),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                });

                var infowindow = new google.maps.InfoWindow();
                var marker, marker2, i;

                var icon = {
                    url: "~/maps/images/MY_Pen.png", //url
                    scaledSize: new google.maps.Size(22, 50), //scaled size
                    origin: new google.maps.Point(0, 0), //origin
                    anchor: new google.maps.Point(0, 0) //anchor
                };

                for (i = 0; i < locations.length; i++) {
                    marker = new google.maps.Marker({
                        title: locations[i][0],
                        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
                        map: map,
                        draggable: true,
                        animation: google.maps.Animation.DROP,
                        icon: '~/maps/images/MY_Pen.png',
                        label: {
                            text: locations[i][0],
                            color: 'red',
                            fontSize: '15px',
                            fontWeight: 'bold',
                            align: 'right'
                        }
                    });

                    function toggelBounce() {
                        if (marker.getAnimation() !== null) {
                            marker.setAnimation(null);
                        } else {
                            marker.setAnimation(google.maps.Animation.BOUNCE);
                        }
                    }

                    google.maps.event.addListener(marker, 'click', (function (marker, i) {
                        return function () {
                            infowindow.setContent('<table width = "200" border = "0"><tr><td> <IMG BORDER = "0" ALIGN = "Left" SRC = "' + locations[i][4] + '"></td><td><table width = "200" border = "0"><tr><td>' + locations[i][0] + '</td></tr><tr><td>&nbsp;</td></tr><tr><td><a href = "' + locations[i][5] + '" target = "_blank">Go To Location</a></td></tr></table></td></tr></table> ');
                            infowindow.open(map, marker);
                        }
                    })(marker, i));

                }
            </script>
        </div>
    </div>
</body>

У меня возникла странная ошибка, когда я поместил эти коды в файл Razor следующим образом

Ошибка парсера

Описание: ошибка произошла во время синтаксического анализа ресурса, необходимого для обслуживания этого запроса. Просмотрите следующие сведения об ошибках синтаксического анализа и соответствующим образом измените исходный файл.

Сообщение об ошибке парсера: «38.5708937» недопустимо в начале блока кода. Действительны только идентификаторы, ключевые слова, комментарии, "(" и "{".

пожалуйста, может кто-нибудь помочь мне в этом вопросе.

javascript c# google-maps asp.net-mvc-4 google-maps-api-3

05.12.2018 10:37

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Добавьте дополнительный @ в строке 29, чтобы он читался (двойной @@)

['Place 3', 38.5708937, 34.6664307, 7, '~/maps/images/p3.png', 'https://www.google.com.sa/maps/place/Al+Sadhan+Stores/@@38.6931256,34.7640829,14.75z/data=!4m8!1m2!2m1!1z2KfZhNiz2K_Yrdin2YYgIDE0!3m4!1s0x0:0x154b423825155cce!8m2!3d24.6934641!4d46.7713577'],

05.12.2018 10:49

Попробуйте кодировать координату как строку вместо чисел с плавающей запятой

  ['Place 1', '33.75586', '35.6628018, 10', '', ''],

05.12.2018 10:59

Другие вопросы по теме

Как инициализировать вложенный отсортированный словарь с помощью Comparer?

Listbox selectedindexchanged удаляет элементы, кроме выбранного

Невозможно отправить значение в базу данных с помощью метода публикации API и почтальона

Как проверить, что я редактирую конкретную страницу Interop.Word

Каталог для использования в модуле ASP.NET Core в процессе размещения SetBasePath

C# сравнение стилей в MS Word

Почему 32-битное значение вызывает исключение BadImageFormatException системы WCF?

System.ArgumentOutOfRangeException на моем RowDataBound

Как создать настраиваемую проверку и / или изменить входное значение для проверки?

Диаграмма вариантов использования для приложения-службы Windows, разработанного на C#

У меня возникла ошибка, когда я установил код JavaScript для API карт Google на странице MVC

Ответы 2

Другие вопросы по теме

Похожие вопросы