Ошибка 400 при попытке загрузить GeoJson в проекте Angular Google Maps

Я получаю сообщение об ошибке 400 при попытке загрузить GeoJson на свою карту. Файл находится в моей папке src/assets. Если я помещу другой файл в эту папку, я смогу получить к нему доступ с помощью http-запроса при запуске сервера ng, а это значит, что у меня должен быть доступ к этим файлам. Но для файла, который я указываю в своем вызове метода loadGeoJson, если я попытаюсь отобразить его в браузере с помощью http://localhost:4200/assets/sample-farms.geojson в браузере отображается главный экран моего приложения...

Значит, происходит какое-то странное перенаправление?

Вот мой код:

import { analyzeAndValidateNgModules } from '@angular/compiler';
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
})
export class AppComponent {
  title = 'simple-gmaps-demo';

  map: any; // important to declare the type of property map, so we can refer to it with this.map
  features: any;  // Do I need this too?
  

  onMapReady(map: google.maps.Map) {

    this.map = map;
    this.map.setCenter({lat:-32.910, lng:117.133});
    this.map.setZoom(10); 

    // Error in this method call?
    this.map.data.loadGeoJson('http://localhost:4200/assets/sample-farms.geojson', {}, 
    function (features: any) {
    console.info(features);
  });

  }
}

Это ошибка, которую я получаю в консоли:

zone-evergreen.js:2845 GET http://localhost:4200/assets/sample-farms.geojson 404 (Not Found)

Любая помощь высоко ценится.

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
2
0
187
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Вы должны сначала попробовать поместить этот URL-адрес в адресную строку, чтобы проверить, существует ли файл. Если да, то я предполагаю, что это проблема с тем, как API карт импортирует данные (API для ссылки: https://developers.google.com/maps/documentation/javascript/reference/data#Data.loadGeoJson)

Я бы предложил импортировать файл с помощью собственного HTTP-клиента angular — https://angular.io/guide/http (или любого другого предпочтительного клиента), а затем вместо этого передавать эти данные напрямую через метод addGeoJson().

Да, по какой-то причине файл на самом деле не существовал, хотя путь был правильным ... Сейчас работает с тем же файлом, скопированным и переименованным. Обновлю, если найду, почему он не может разрешить этот URL!

staf 14.12.2020 06:04

действительно странно, это может быть проблема с регистром - если в имени файла есть символы верхнего регистра, которые либо не совпали, либо, возможно, неправильно отслеживаются в git, это также может привести к проблемам. Но хорошо, что вы хотя бы можете заставить вещи работать!

chrismclarke 14.12.2020 07:11

Возможно, это было связано с тем, что его не отслеживали в git... Спасибо за помощь, Крис!

staf 14.12.2020 12:18

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