jQuery 모바일 링크 리플렛 맵으로 전환

Question

jQuery Mobile을 사용하는 사이트가 있고 페이지 중 하나에는 Cloudmade의 전단지를 사용하는지도가 표시됩니다. 잘못된 장소에서 마커 이미지 파일을 얻을려고하는 것 같다에서

This page loads up and shows a map with a marker

,이 모두가 잘 작동하지만 ...

I have another page with a link to the map page는 다음이 OK 떨어져 최대로드합니다.

아무도 그 페이지에서 어떤 문제가 있는지 알 수 있습니까?

내가 아는 바로는. jQuery Mobile은 대상 페이지의 아약스 동적로드를 대신하기 위해 일반 HREF 링크를 다시 작성합니다. 이것은 신비하고 나에게 잘 들어 맞지 않지만, 나 같은 개발자는 나 자신에게 그것을 염려 할 필요가 없다. 그러나이 경우 전단지 호출 코드에 대한 무언가가 mangling에서 살아남지 못합니다.

Failed to load resource: the server responded with a status of 404 (Not Found) 
http://placr.mobi/dist/images/marker.png 

...은 사파리가보고 한 오류입니다. 실제로이 경로는 올바르지 않습니다. 나는 '전단'이라는 디렉토리에 위치한 'dist'디렉토리의 내용으로 전단지를 설정했다. 작동해야합니까? 사실 은 jQuery mangling 이후에과 별개로 작동합니다.

조금만 살펴보면 리플릿 소스 코드에서 'dist'에 대한 언급이 발견되지 않았지만 (내가 예상했던대로 해당 디렉토리를 다른 것으로 확실히 호출 할 수 있어야합니까?) 참조 번호 은으로 컴파일됩니다. uglified 자바 스크립트 ('return"../../dist/"')

아마 누군가가 jQuery를 모바일의 예를 가지고 있으며,

Answer 1

문제는 leaflet.js 스크립트 태그의 기준으로 ROOT_URL를 평가한다는 것입니다 (이상적으로 마커 이미지 포함) 협력 전단지 HTML에서 src 속성. 하지만 스크립트 태그가 첫 페이지에 없습니다. 두 번째 대안 솔루션이를 추가하는 것입니다

<div data-role="content" > 

: 세 이하 정확히

<script src="/leaflet/leaflet.js" type="text/javascript"></script> 

: 첫 페이지에서

(http://placr.mobi/maplinktest) 위의 라인을 넣어 두 번째 페이지에서 다음을 따르세요.

L.Icon = L.Icon.extend({ 
    iconUrl: <markerUrl>, 
    shadowUrl: <shadowUrl> 
}); 

두 번째 방법으로 명시 적으로 이미지 URL을 설정하고 있습니다.

세 번째 솔루션은 첫 페이지의 앵커에 확인해 = "외부"를 추가하는 것입니다

<a href="/map?lat=51.45289&amp;lon=-0.1003&amp;zoom=16" rel="external" class="ui-link">Link to map page</a>