【发布时间】：2015-12-15 07:58:15
【问题描述】：
var exampleApp= angular.module('starter', ['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
exampleApp.controller('MapController', function($scope, $ionicLoading) {
var map;
var map_marker;
var lat = null;
var lng = null;
var lineCoordinatesArray = [];
// sets your location as default
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var locationMarker = null;
if (locationMarker){
// return if there is a locationMarker bug
return;
}
lat = position.coords["latitude"];
lng = position.coords["longitude"];
// calls PubNub
pubs();
// initialize google maps
google.maps.event.addDomListener(window, 'load', initialize());
},
function(error) {
console.log("Error: ", error);
},
{
enableHighAccuracy: true
}
);
}
function initialize() {
console.log("Google Maps Initialized")
map = new google.maps.Map(document.getElementById('map'), {
zoom: 15,
center: {lat: lat, lng : lng, alt: 0}
});
map_marker = new google.maps.Marker({position: {lat: lat, lng: lng}, map: map});
map_marker.setMap(map);
}
// moves the marker and center of map
function redraw() {
map.setCenter({lat: lat, lng : lng, alt: 0})
map_marker.setPosition({lat: lat, lng : lng, alt: 0});
pushCoordToArray(lat, lng);
var lineCoordinatesPath = new google.maps.Polyline({
path: lineCoordinatesArray,
geodesic: true,
strokeColor: '#2E10FF',
strokeOpacity: 1.0,
strokeWeight: 2
});
lineCoordinatesPath.setMap(map);
}
function pushCoordToArray(latIn, lngIn) {
lineCoordinatesArray.push(new google.maps.LatLng(latIn, lngIn));
}
function pubs() {
pubnub = PUBNUB.init({
publish_key: 'pub-c-2df55398-9110-4b2b-bdab-97bf634be349',
subscribe_key: 'sub-c-6b2c387c-7148-11e4-86a8-02ee2ddab7fe'
})
pubnub.subscribe({
channel: "mymaps",
message: function(message, channel) {
console.log(message)
lat = message['lat'];
lng = message['lng'];
//custom method
redraw();
},
connect: function() {console.log("PubNub Connected")}
})
}
});
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="http://cdn.pubnub.com/pubnub-3.7.1.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3&sensor=false&language=en"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content ng-controller="MapController">
<div id="map" data-tap-disabled="true"></div>
</ion-content>
</ion-pane>
</body>
</html>【问题讨论】：
-
您好。我注意到您的谷歌地图 API 代码中的
sensor=false。也许这是相关的？我会帮助进一步审查。
标签： javascript ionic pubnub