Jquery

[lismansihotang]

hi, thank for the nice library. how about to use jquery in this?please help me

[lamadipen]

if you need to insert jquery on certain event like onclick or onboundschanged then you can do as below on your controller class.

 $config['onclick'] = '//alert(\'You just clicked at: \' + event.latLng.lat() + \', \' + event.latLng.lng());
                            $("#from").val(event.latLng.lat()+", "+ event.latLng.lng());
                            var iw_map = new google.maps.InfoWindow();

                            var directionsService = new google.maps.DirectionsService;                                
                            //circle_0.setMap(null);
                            var marker_icon = {
                                    url: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|9999FF|000000"};

                            marker_0.setOptions({
                                position: new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()),
                                icon : marker_icon 
                            });
                            marker_0.set("content", "Lattitude"+event.latLng.lat()+"Longitude"+event.latLng.lng());

                            iw_map.setContent(marker_0.get("content"));
                            iw_map.open(map, marker_0);

                            /**
                            var circleCenter = new google.maps.LatLng(event.latLng.lat(),event.latLng.lng())                

                            var circleOptions = {
                                strokeColor: "0.8",
                                strokeOpacity: 0.8,
                                strokeWeight: 2,
                                fillColor: "#FF0000",
                                fillOpacity: 0.3,
                                map: map,
                                center: circleCenter,
                                radius: 400
                            };
                            circle_0 = new google.maps.Circle(circleOptions);
                            **/
                          /** ajax start **/     
                          $.post("fiber_coverage/test", {lat:event.latLng.lat(),lng:event.latLng.lng()} ,function(data,status){
                                    var nearest_points = JSON.parse(data);            
                                    //position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng())
                                    var counter =1; 
                                    var myLatlng ;
                                    var info= "";
                                    var gps ="";

                                    for (i in nearest_points)
                                    {
                                      counter++;                   
                                      //console.log(nearest_points[i].name);

                                      var new_lat = parseFloat(nearest_points[i].latitude);
                                      var new_lng = parseFloat(nearest_points[i].longitude);
                                      var name = nearest_points[i].name;
                                      info +=  "Bamboo: " + name +" | GPS: "+ new_lat+", "+new_lng+"<br/>";
                                      gps = new_lng+", "+new_lat;                 
                                      myLatlng = new google.maps.LatLng(new_lng,new_lat);

                                      window["marker" + counter]  = createMarker_map({ map: map, position:myLatlng, title: name, label:name })

                                      attachSecretMessage(window["marker" + counter],name, gps);          
                                    } 
                                    $("#bambooListDiv").html(info);  

                                    /** set infowindow and onclick event on map**/
                                    function attachSecretMessage(marker, secretMessage,gps) {
                                      var infowindow = new google.maps.InfoWindow({
                                        content: secretMessage
                                      });

                                      marker.addListener("click", function() {
                                        infowindow.open(marker.get("map"), marker);
                                        $("#to").val(gps);
                                      });
                                    }
                                    /** set infowindow and onclick event on map**/  

                                });
                                /** ajax end **/
                         ';
    $config['onboundschanged'] = '
        if (!centreGot) {
        var mapCentre = map.getCenter();
        var marker_icon = {
                url: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|9999FF|000000"};

        marker_0.setOptions({
            position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng()),
            icon : marker_icon 
        });

        $("#from").val(mapCentre.lat()+", "+mapCentre.lng());

        var circleCenter = new google.maps.LatLng(mapCentre.lat(),mapCentre.lng())              

        var circleOptions = {
            strokeColor: "0.8",
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: "#FF0000",
            fillOpacity: 0.3,
            map: map,
            center: circleCenter,
            radius: 400
        };
        //circle_0 = new google.maps.Circle(circleOptions);

        /** ajax start **/                              
        $.post("fiber_coverage/test", {lat:mapCentre.lat(),lng:mapCentre.lng()} ,function(data,status){
            var nearest_points = JSON.parse(data);            
            //position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng())
            var counter =0; 
            var myLatlng ;
            var info= "";
            var gps ="";
            for (i in nearest_points)
            {
              counter++;                   

              var new_lat = parseFloat(nearest_points[i].latitude);
              var new_lng = parseFloat(nearest_points[i].longitude);
              var name = nearest_points[i].name;

              info +=  "Bamboo: " + name +" | GPS: "+ new_lat+", "+new_lng+"<br/>";
              gps = new_lng+", "+new_lat;
              myLatlng = new google.maps.LatLng(new_lng, new_lat);                  
              window["marker" + counter]  = createMarker_map({ map: map, position:myLatlng, title: name }) 

              attachSecretMessage(window["marker" + counter],name,gps);                            
            }                 
            $("#bambooListDiv").html(info);  

            /** set infowindow and onclick event on map**/
            function attachSecretMessage(marker, secretMessage, gps) {
              var infowindow = new google.maps.InfoWindow({
                content: secretMessage                   
              });

              marker.addListener("click", function() {
                infowindow.open(marker.get("map"), marker);
                $("#to").val(gps);
              });                  
            }
            /** set infowindow and onclick event on map**/                                                               
        });
        /** ajax end **/
        centreGot = true;
    }       
    else
    {
       map.setCenter(new google.maps.LatLng(27.71796154942124, 85.32299995422363));
    }
    ';

[lismansihotang]

Hi,,
Nice info, but i still dont understand how to sent a message to front end
using jquery with dialog box,thx
Regards,
On Jan 5, 2016 11:17 AM, "Dipen Lama" notifications@github.com wrote:

if you need to insert jquery on certain even line onclick or
onboundschanged then you can do as below on your controller class.

$config['onclick'] = '//alert('You just clicked at: ' +
event.latLng.lat() + ', ' + event.latLng.lng());
$("#from").val(event.latLng.lat()+", "+ event.latLng.lng());
var iw_map = new google.maps.InfoWindow();

                        var directionsService = new google.maps.DirectionsService;
                        //circle_0.setMap(null);
                        var marker_icon = {
                                url: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|9999FF|000000"};

                        marker_0.setOptions({
                            position: new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()),
                            icon : marker_icon
                        });
                        marker_0.set("content", "Lattitude"+event.latLng.lat()+"Longitude"+event.latLng.lng());

                        iw_map.setContent(marker_0.get("content"));
                        iw_map.open(map, marker_0);

                        /**
                        var circleCenter = new google.maps.LatLng(event.latLng.lat(),event.latLng.lng())

                        var circleOptions = {
                            strokeColor: "0.8",
                            strokeOpacity: 0.8,
                            strokeWeight: 2,
                            fillColor: "#FF0000",
                            fillOpacity: 0.3,
                            map: map,
                            center: circleCenter,
                            radius: 400
                        };
                        circle_0 = new google.maps.Circle(circleOptions);
                        **/
                      /** ajax start **/
                      $.post("fiber_coverage/test", {lat:event.latLng.lat(),lng:event.latLng.lng()} ,function(data,status){
                                var nearest_points = JSON.parse(data);
                                //position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng())
                                var counter =1;
                                var myLatlng ;
                                var info= "";
                                var gps ="";

                                for (i in nearest_points)
                                {
                                  counter++;
                                  //console.log(nearest_points[i].name);

                                  var new_lat = parseFloat(nearest_points[i].latitude);
                                  var new_lng = parseFloat(nearest_points[i].longitude);
                                  var name = nearest_points[i].name;
                                  info +=  "Bamboo: " + name +" | GPS: "+ new_lat+", "+new_lng+"<br/>";
                                  gps = new_lng+", "+new_lat;
                                  myLatlng = new google.maps.LatLng(new_lng,new_lat);

                                  window["marker" + counter]  = createMarker_map({ map: map, position:myLatlng, title: name, label:name })

                                  attachSecretMessage(window["marker" + counter],name, gps);
                                }
                                $("#bambooListDiv").html(info);

                                /** set infowindow and onclick event on map**/
                                function attachSecretMessage(marker, secretMessage,gps) {
                                  var infowindow = new google.maps.InfoWindow({
                                    content: secretMessage
                                  });

                                  marker.addListener("click", function() {
                                    infowindow.open(marker.get("map"), marker);
                                    $("#to").val(gps);
                                  });
                                }
                                /** set infowindow and onclick event on map**/

                            });
                            /** ajax end **/
                     ';
$config['onboundschanged'] = '
    if (!centreGot) {
    var mapCentre = map.getCenter();
    var marker_icon = {
            url: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=A|9999FF|000000"};

    marker_0.setOptions({
        position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng()),
        icon : marker_icon
    });

    $("#from").val(mapCentre.lat()+", "+mapCentre.lng());

    var circleCenter = new google.maps.LatLng(mapCentre.lat(),mapCentre.lng())

    var circleOptions = {
        strokeColor: "0.8",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#FF0000",
        fillOpacity: 0.3,
        map: map,
        center: circleCenter,
        radius: 400
    };
    //circle_0 = new google.maps.Circle(circleOptions);

    /** ajax start **/
    $.post("fiber_coverage/test", {lat:mapCentre.lat(),lng:mapCentre.lng()} ,function(data,status){
        var nearest_points = JSON.parse(data);
        //position: new google.maps.LatLng(mapCentre.lat(), mapCentre.lng())
        var counter =0;
        var myLatlng ;
        var info= "";
        var gps ="";
        for (i in nearest_points)
        {
          counter++;

          var new_lat = parseFloat(nearest_points[i].latitude);
          var new_lng = parseFloat(nearest_points[i].longitude);
          var name = nearest_points[i].name;

          info +=  "Bamboo: " + name +" | GPS: "+ new_lat+", "+new_lng+"<br/>";
          gps = new_lng+", "+new_lat;
          myLatlng = new google.maps.LatLng(new_lng, new_lat);
          window["marker" + counter]  = createMarker_map({ map: map, position:myLatlng, title: name })

          attachSecretMessage(window["marker" + counter],name,gps);
        }
        $("#bambooListDiv").html(info);

        /** set infowindow and onclick event on map**/
        function attachSecretMessage(marker, secretMessage, gps) {
          var infowindow = new google.maps.InfoWindow({
            content: secretMessage
          });

          marker.addListener("click", function() {
            infowindow.open(marker.get("map"), marker);
            $("#to").val(gps);
          });
        }
        /** set infowindow and onclick event on map**/
    });
    /** ajax end **/
    centreGot = true;
}
else
{
   map.setCenter(new google.maps.LatLng(27.71796154942124, 85.32299995422363));
}
';

—
Reply to this email directly or view it on GitHub
#48 (comment)
.