관리 메뉴

웹개발자의 기지개

구글 Chart api 와 jquery mobile 연동시 오류해결방법 본문

jquery

구글 Chart api 와 jquery mobile 연동시 오류해결방법

http://portfolio.wonpaper.net 2018. 11. 18. 14:38

구글 api 에서 제공해주는 Chart 소스를 연동하면 상당히 가볍고 깔끔한 그래픽 화면 출력이 가능한데,  이를 jquery mobile 과 연동하니 다름이 아니라 다음과 같은 오류메세지가 떴다. 소스가 아얘 열리지도 않고 답답했다.
문제는 다양한 자바스크립트와 ajax 내부 처리 때문에 자바스크립트 소스끼리 꼬이는 것이다. 으악~~

크롭으로 요소분석해보면
Uncaught ReferenceError: google is not defined

구글링으로 드디어 해결했다. 역시 구글이다. 이렇게 간단할 줄이야 ㅜㅜ;;;

정답은 ajax 기능은 끄는것이다. 원래 jquery mobile 은 기본적으로 ajax 기능이 디폴트로 가동된다.
이에 페이지 링크시에  data-ajax="false" 해주면 비동기기능이 꺼지면서, 일반 페이지 방식으로 처리되면서,

<a href="stat1.html"  data-transition="slide" data-ajax="false">다음페이지</a>

자~ 연스럽게 차트가 나타났다. 우와~~ 커피 한잔 ~

문제해결 참고페이지 : http://stackoverflow.com/questions/9478455/google-charts-jquery-mobile-not-showing-up 

Comments