타이타늄에서 간단한 구글 지도를 써야할 때는 웹뷰로...

DongWoo_Gim · 5월 24, 2016, 12:03오후

그냥 간단한 팁인데 막상 할라면 시간 많이 걸리는 부분이라 공유해 봅니다.

구글맵을 이용해서 어딘가의 위치를 앱에서 지도 형태로 표현하고 싶습니다.
ti.map 모듈은 좋지만 너무 과하죠. 앱 크기도 커지고, 자칫하면 too many method가 됩니다.

결론은 타이타늄의 강력한 웹뷰를 이용합니다.

웹뷰에서 불러올 html을 app/assets/html/GMapSingle.html 이라고 저장합니다.
다음 코드를 참고합니다.

gist.github.com

https://gist.github.com/gimdongwoo/b0f40728bb1bf5a3aa7ede3e2443aa10

GMapsSingle.html

<!-- app/assets/html/GMapsSingle.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>GMapsSingle</title>
    <style>
      html, body {
        height: 1920px;

This file has been truncated. show original

map.js

/**
* map view show
*/
var loadingPlugin = { show: function(){}, hide: function() {} };
var webView = {};

var mapViewShow = function (_location) {
  Ti.API.debug('debug', 'mapViewShow', _location);
  
  webView = Titanium.UI.createWebView({

This file has been truncated. show original

도움이 되셨기를~

jazzparty · 5월 25, 2016, 6:55오전

Ti.map 사용시 too many method 땜에 골치였는데…
웹으로 처리하는게 좋겠네요…
감사합니다~ ^^