Leaflet: v: 1.1.0: 기본 마커 아이콘에 대한 URL이 잘못되었습니다.

에 만든 2017년 07월 05일 · 3코멘트 · 출처: Leaflet/Leaflet

번식 방법

내가 사용하는 전단지 버전: 1.1.0
브라우저(버전 포함) 사용 중인 브라우저: Chrome 59
사용 중인 OS/플랫폼(버전 포함): MacOS 10.12
React + Rubix Admin 템플릿과 함께 전단지 사용. 이 동일한 설정 및 문제 없이 전단지 0.7을 사용했습니다. 전단지는 Bower를 통해 설치됩니다.

내가 기대하는 행동과 내가 보고 있는 행동

전단지 마커가 올바르게 로드되어야 합니다. 대신 다음 오류 메시지가 나타납니다.

GET http://localhost :8080/bower_components/leaflet/dist/imagesmarker-icon-2x.png 404(찾을 수 없음)

하지만 해당 URL은 "이미지"와 "marker-icon-2x.png" 사이에 슬래시가 없기 때문에 잘못된 것입니다.

슬래시로 형식을 지정해야 합니다. Leaflet 소스로 이동하여 IconDefault 옵션을 다음과 같이 변경하면(Line 6976...):

    iconUrl:       '/marker-icon.png',
    iconRetinaUrl: '/marker-icon-2x.png',
    shadowUrl:     '/marker-shadow.png',

그러면 예상대로 작동합니다.

0.7.7로 되돌리면 이 문제가 사라집니다. 이 문제의 원인은 무엇입니까?

출처

brambow

가장 유용한 댓글

아마도 이것은 내가 방금 겪은 문제와 관련이 있습니다. 마커가 로드되지 않습니다(기본 64로 로드하려고 함).

번식 방법

내가 사용하는 전단지 버전: 1.1.0
브라우저(버전 포함) 사용 중인 버전: 버전 59.0.3071.115(공식 빌드)(64비트)
사용 중인 OS/플랫폼(버전 포함): MacOS 10.12.5
Angular 2와 함께 전단지 사용. NPM을 통해 설치하고 @types/leaflet 를 사용하여 Angular CLI로 프로젝트를 설정했습니다.

내가 기대하는 행동과 내가 보고 있는 행동

나를 위해 Leaflet 라이브러리는 아이콘을 Base 64로 로드합니다.

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB[CUT_FOR_BREVITY]ASUVORK5CYII=&quot;)marker-icon.png" class="leaflet-marker-icon leaflet-zoom-animated leaflet-interactive" tabindex="0" style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; transform: translate3d(225px, 197px, 0px); z-index: 197; outline: none;">

src 필드 끝에 ")marker-icon.png 가 포함되어 있어 이미지가 잘못된 base64로 로드되지 않습니다. Chrome 관리자에서 제거하면 아이콘이 정상적으로 나타납니다.

ethanmick 에 2017년 07월 05일

👍4

모든 3 댓글

사실, 더 나은 수정은 경로에 마지막 슬래시가 포함되도록 L.Icon.Default.imagePath를 설정하는 것입니다. 이 시점에서 나는 왜 이렇게 보이는 것이 변하는지 궁금할 것입니다.

brambow 에 2017년 07월 05일

아마도 이것은 내가 방금 겪은 문제와 관련이 있습니다. 마커가 로드되지 않습니다(기본 64로 로드하려고 함).

번식 방법

내가 사용하는 전단지 버전: 1.1.0
브라우저(버전 포함) 사용 중인 버전: 버전 59.0.3071.115(공식 빌드)(64비트)
사용 중인 OS/플랫폼(버전 포함): MacOS 10.12.5
Angular 2와 함께 전단지 사용. NPM을 통해 설치하고 @types/leaflet 를 사용하여 Angular CLI로 프로젝트를 설정했습니다.

내가 기대하는 행동과 내가 보고 있는 행동

나를 위해 Leaflet 라이브러리는 아이콘을 Base 64로 로드합니다.

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB[CUT_FOR_BREVITY]ASUVORK5CYII=&quot;)marker-icon.png" class="leaflet-marker-icon leaflet-zoom-animated leaflet-interactive" tabindex="0" style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; transform: translate3d(225px, 197px, 0px); z-index: 197; outline: none;">

ethanmick 에 2017년 07월 05일

👍4

안녕하세요 여러분, 신고해 주셔서 감사합니다. 나는 당신이 설명하는 문제가 #4968과 동일하다고 확신하므로 이것을 중복으로 닫습니다. 또 다른 문제라고 생각하시면 말씀해 주시면 재오픈을 고려하겠습니다.

perliedman 에 2017년 07월 06일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Leaflet: v: 1.1.0: 기본 마커 아이콘에 대한 URL이 잘못되었습니다.

번식 방법

내가 기대하는 행동과 내가 보고 있는 행동

가장 유용한 댓글

번식 방법

내가 기대하는 행동과 내가 보고 있는 행동

모든 3 댓글

번식 방법

내가 기대하는 행동과 내가 보고 있는 행동

관련 문제