javascript - Marker click event not firing for ui-gmap-marker in Map Controller -


i have app controller google map. click event not fire when run on phone. however, click event fires when test on ripple emulator. below map page , corresponding controller. 

<ons-toolbar> <div class="left"><ons-back-button>back</ons-back-button></div> <div class="center page-title">map mapcontroller2</div> </ons-toolbar>  <ui-gmap-google-map center="map.center" refresh="true" zoom="map.zoom" draggable="true">      <ui-gmap-marker idkey="marker.id" ng-repeat="marker in map.markers" coords="marker" icon="marker.icon" click="onmarkerclicked()">         <ui-gmap-window show="windowoptions" coords="marker" closeclick="closeclick">             <div style="color: black">         {{marker.title}}<br/>         @ {{marker}}             </div>         </ui-gmap-window>     </ui-gmap-marker>  </ui-gmap-google-map> 

// map controller app.controller('mapcontroller2', function($scope, $rootscope, $http) {     var data = {};      data.map = {         zoom: 12,         center: {             latitude: 27.949,             longitude: -81.958         },         markers: [             {                 id: 1,                 icon: 'img/blue_marker.png',                 latitude: 27.949,                 longitude: -81.999,                 title: 'this asdf;lkj  asdf;lj  ;asdf;lkasf; ;jasdfpoiarwtonmsad'             },             {                 id: 2,                 latitude: 27.949,                 longitude: -81.958,                 title: 'job site'             },             {                 id: 3,                 icon: 'img/plane.png',                 latitude: 27.949,                 longitude: -81.94,                 title: 'airport'             }]     };      $scope.windowoptions = false;      $scope.onmarkerclicked = function () {         this.windowoptions = !this.windowoptions;     };      $scope.closeclick = function () {         this.windowoptions = false;     };      $scope.map = data.map; });

i found solution after lot on digging. html using below. using “ui-gmap-markers” (with “s”) instead of “ui-gmap-marker”. also, had encapsulate google map ’data-tap-disabled=”true”’ work on phone.

<ons-page class="map" ng-controller="mapcontroller2" sliding-menu-ignore="true">      <ons-toolbar>         <div class="left"><ons-back-button>back</ons-back-button></div>         <div class="center page-title">map mapcontroller</div>     </ons-toolbar>      <ui-gmap-google-map center="map.center" refresh="true" zoom="map.zoom" draggable="true" data-tap-disabled="true">          <ui-gmap-window show="map.window.show" coords="map.window.model" options="map.window.options" closeclick="map.window.closeclick()">             <div style="color: black">                 {{map.window.title}}             </div>         </ui-gmap-window>         <ui-gmap-markers idkey="marker.id" models="map.markers" coords="'self'" docluster="false" fit="'true'" icon="'icon'" events="map.markersevents " options="'options'"></ui-gmap-markers>      </ui-gmap-google-map>  </ons-page>

and controller looks this:

// map controller     app.controller('mapcontroller2', function($scope, $rootscope, $http) {         var data = {};          data.map = {             zoom: 12,             center: {                 latitude: 27.949,                 longitude: -81.958             },             markers: [                 {                     id: 1,                     icon: 'img/blue_marker.png',                     latitude: 27.949,                     longitude: -81.999,                     title: 'this are'                 },                 {                     id: 2,                     latitude: 27.949,                     longitude: -81.958,                     title: 'job site'                 },                 {                     id: 3,                     icon: 'img/plane.png',                     latitude: 27.949,                     longitude: -81.94,                     title: 'airport'                 }],             markersevents: {                 click: function(marker, eventname, model, arguments) {                     console.log('marker clicked (' + marker + ', ' + eventname);//+', '+mydump(model, 0)+', '+mydump(arguments)+')');                     $scope.map.window.model = model;                     $scope.map.window.model = model;                     $scope.map.window.title = model.title;                     $scope.map.window.show = true;                 }             },             window: {                 marker: {},                 show: false,                 closeclick: function() {                     this.show = false;                 },                 options: {}, // define when map ready                 title: ''             }         };          //$scope.window = false;          $scope.onmarkerclicked = function (m) {             //this.windowoptions = !this.windowoptions;             console.log('marker clicked');             console.log(m);         };          $scope.closeclick = function () {             this.window = false;         };          $scope.map = data.map;      });

Comments

Post a Comment

Popular posts from this blog

node.js - Using Node without global install -

i'm working on few node & electron (atom shell) projects , i'm curious how them work without user having install node globally. i've seen few applications including node directory in project contains node.exe binary. how go setting node project use binary? edit: thought should add, i've searched everywhere answer this, unrelated results.
Read more

How to access a php class file from PHPFox framework into javascript code written in simple HTML file? -

i've website developed using phpfox v3.0.7 . now i'm trying implement 'sse(server sent events)' 1 of php files. reference i'm giving below necessary code part of file. file titled process.class.php , present @ location /var/www/module/notification/include/service/process.class.php present on server having ip http://34.124.40.142/ . <?php /** * [phpfox_header] */ header('content-type: text/event-stream'); header('cache-control: no-cache'); defined('phpfox') or exit('no dice!'); /** * * * @copyright [phpfox_copyright] * @author raymond benc * @package phpfox_service * @version $id: service.class.php 67 2009-01-20 11:32:45z raymond_benc $ */ class notification_service_process extends phpfox_service { /** * class constructor */ public function __construct() { $this->_stable = phpfox::gett('notification'); } public function add($...
Read more

java - Null response to php query in android, even though php works properly -

Image
table i'm trying retrieve above data using 2 php files below. want pass email parameter , return bets user = email. work fine when tested advanced rest client, problem not php. however, when try through android 2 java classes below, null pointer exception (logcat below) , json object returned null. i'm not sure error is, think i'm not passing parameter php , that's why it's producing null response. logcat 05-31 15:10:50.227 26074-26074/com.example.albert.betterapp e/androidruntime﹕ fatal exception: main process: com.example.albert.betterapp, pid: 26074 java.lang.runtimeexception: unable start activity componentinfo{com.example.albert.betterapp/com.example.albert.betterapp.displayallbets}: java.lang.nullpointerexception @ android.app.activitythread.performlaunchactivity(activitythread.java:2292) @ android.app.activitythread.handlelaunchactivity(activitythread.java:2350) @ android.app.activitythread.acce...
Read more