Jump to content

ext.panel undefined


jahlxx

Recommended Posts

ok.

 

I've reviewed the google maps sample in the unigui samples folder, in desktop version ans in mobile version.

 

I don't know how make markers and polygons.

 

If I could show marker and polygons with the samples, is enough for me, but I need some help.

 

thanks.

Link to comment
Share on other sites

ok. after some google investigation, I've done this, based in the standard sample of unigui:

 

 

------------------------------

function afterupdatehtml(sender, eOpts)
{
   var latlng = new google.maps.LatLng(0.0, 0.0);
   var myOptions = {
      zoom: 1,  
      center: latlng,
      mapTypeId: google.maps.MapTypeId.SATELLITE
    };
    
    var umap = document.getElementById("uni_map_canvas");
    var map = new google.maps.Map(umap, myOptions);
    var marker, i;
    var locations = [
      ['MARKER 1', sender.x, sender.y, 1],
      ['MARKER 1', 37.222035, -5.334854, 2]
    ];    
    googleMap = map;

   for (i = 0; i < locations.length; i++) {  
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[1], locations[2]),
        map: map
      });

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }

    google.maps.event.addListener(map, 'zoom_changed',
       function() {
         MainmForm.UnimSlider1.setValue(this.getZoom());
       }
    );

    google.maps.event.addListener(map, 'tilesloaded',
       function(e) {
         ajaxRequest(MainmForm.UnimHTMLFrame1,
                     'loaded', []);
       }
    );
   
}

 

 

------------------------------

 

 

the problem now, is that I don't know how to pass parameters (x e y), to draw the markers.

 

some help please.

 

thanks.

Link to comment
Share on other sites

Inside afterupdatehtml function change google.maps.event.addListener(map, 'click', .. part like that

google.maps.event.addListener(map, 'click', 
       function(e) {
         var marker = new google.maps.Marker({
           position: e.latLng,
           map: map,
           title: 'My marker'
         });
       }
    );

after do this when you touch on map it add marker.

Link to comment
Share on other sites

sorry, don't work.

 

the problem is that the script doesn't recognize the variables x and y.

 

I've tested

- x,y

- sender.x, sender.y

- mainform.x, mainform.y

 

without success.

 

If I could to solve this, the marks will be drawed, but I don't know how,

 

I think that the correct way is mainform.x and mainform.y, but it not works.

 

any idea?

Link to comment
Share on other sites

if you wanna add marker when touch map change afterupdatehtml function like that

function afterupdatehtml(sender, eOpts)
{

   var latlng = new google.maps.LatLng(0.0, 0.0);
   var myOptions = {
      zoom: 1,  
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    
    var umap = document.getElementById("uni_map_canvas");
    var map = new google.maps.Map(umap, myOptions);
    googleMap = map;

    google.maps.event.addListener(map, 'zoom_changed', 
       function() {
         MainmForm.UnimSlider1.setValue(this.getZoom()); 
       }
    );

    google.maps.event.addListener(map, 'tilesloaded', 
       function(e) {
         ajaxRequest(MainmForm.UnimHTMLFrame1, 
                     'loaded', []);
       }
    );
    
    google.maps.event.addListener(map, 'click', 
       function(e) {
         var marker = new google.maps.Marker({
           position: e.latLng,
           map: map,
           title: 'My Marker'
         });
       }
    );
}
Link to comment
Share on other sites

ok. thanks.

 

I wanted to draw a map, markers and polygons.

 

I think that I've solved the problem.

 

Not modifying the function afterupdatehtm. I keep that function as the original in the sample.

 

In the mainform, I rewrite this procedure to get that I want, and as I can see it works. I don't know if is the better solution, but ii works for me. any other idea will be well received.

 

 

procedure TMainmForm.SetCoord(Lat, Long : Real);
var
   script: string;
begin
  if WebMode then begin
    script := ('var gm=googleMap;if (typeof gm=="object") {gm.setCenter(new google.maps.LatLng('+
                        StringReplace(Format('%2.4f', [Lat]), ',', '.', [rfReplaceAll])+','+
                        StringReplace(Format('%2.4f', [Long]), ',', '.', [rfReplaceAll])+
                      ')); gm.setZoom(8);}');

    script := script +
       'var marker, i;' +
       'var locations = [' +
       '[''MARKER 1'', 37.222035, -5.334854, 1],' +
       '[''MARKER 2'', 37.322035, -5.434854, 2]' +
       '];' +
       'for (i = 0; i < locations.length; i++) {' +
       '   marker = new google.maps.Marker({' +
       '   position: new google.maps.LatLng(locations[1], locations[2]),' +
       '   map: googleMap,' +
       '   title: locations[0]' +
       '});' +
       '}';

    script := script +
        '   var vertices = ['+
        '{lat: 37.322067, lng: -5.4359651},' +
        '{lat: 37.3209311, lng: -5.4348386},' +
        '{lat: 37.3220418, lng: -5.4329825},' +
        '{lat: 37.32375, lng: -5.43318} ]; ' +
        'var poligono = new google.maps.Polygon({' +
        'map: googleMap,' +
        'paths: vertices,' +
        'strokeColor: ''#FF0000'',' +
        'strokeOpacity: 0.8,' +
        'strokeWeight: 3,' +
        'fillColor: ''#86CD31'',' +
        'fillOpacity: 0.35' +
        '});';

    script := script +
        '   var vertices = ['+
        '{lat: 37.222067, lng: -5.3359651},' +
        '{lat: 37.2209311, lng: -5.3348386},' +
        '{lat: 37.2220418, lng: -5.3329825},' +
        '{lat: 37.22375, lng: -5.33318} ]; ' +
        'var poligono = new google.maps.Polygon({' +
        'map: googleMap,' +
        'paths: vertices,' +
        'strokeColor: ''#FF0000'',' +
        'strokeOpacity: 0.8,' +
        'strokeWeight: 3,' +
        'fillColor: ''#86CD31'',' +
        'fillOpacity: 0.35' +
        '});';

    UniSession.AddJS(script);
  end;
end;
 

Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...