0

我在移动 XPages 应用程序中使用 Google Maps 自定义控件 ( http://www.openntf.org/catalogs/a2cat.nsf/topicThread.xsp?action=openDocument&documentId=068D8F976D87B29E852578B200259707 )。这在 8.5.3 中有效 - 但在服务器升级到 9.0 后它不再有效。

我现在试图缩小问题范围,这就是我所在的位置:

  1. 创建单个 XPage 并添加自定义控件 - 它可以工作
  2. 创建具有移动前缀的单个 XPage,带有单个页面应用程序控件和单个应用程序页面。将自定义控件添加到应用程序页面 - 它不起作用....

当我查看两者的源代码时,第一个包含一些客户端 JS 来运行 onClientLoad。对于移动页面,情况似乎并非如此......:-/

关于如何解决这个问题的任何想法?

更新解决方案: 如果其他人最终遇到这种情况,我已经编辑了我的问题以包含 appPage 和代码工作(并且 ccGoogleMaps 代码被注释掉)。这应该会引导您朝着正确的方向前进 - 甚至可能会提出更好的解决方案;-)

>       <xe:appPage id="appPage4" pageName="map" resetContent="true">
>           <xe:djxmHeading id="djxmHeading3" label="">
>               <xe:this.back><![CDATA[<<]]></xe:this.back>
>               <xe:this.moveTo><![CDATA[#{javascript:"place&documentId=" + viewScope.currentPlaceUnid +
> "&action=openDocument"}]]></xe:this.moveTo>           </xe:djxmHeading>
>           <xp:panel styleClass="container">
>               <xp:this.data>
>                   <xp:dominoDocument var="document1" formName="Place" action="openDocument"
>                       documentId="#{javascript:viewScope.currentPlaceUnid}">
>                       <xp:this.postOpenDocument><![CDATA[#{javascript:var v:java.util.Vector = document1.getItemValue("Address"); var addr = "";
> for(var i=0; i<v.size(); i++) {   if(i>0) addr += ","     addr +=
> v.elementAt(i) } viewScope.address =
> addr;}]]></xp:this.postOpenDocument>
>                   </xp:dominoDocument>
>               </xp:this.data>
>               <div id="div1"></div> <!--              <xc:ccGoogleMaps map_height="400" map_width="320" map_width_measurement="px" map_height_measurement="px"
>                   map_zoom="10" map_type="ROADMAP" map_center_type="Address" map_center_address="#{javascript:viewScope.address}">
>                   <xc:this.marker>
>                       <xc:marker location_type="Address" animation="DROP"
>                           location_address="#{javascript:viewScope.address}">
>                           <xc:this.infotext><![CDATA[#{javascript:var info = "<b>" + document1.getItemValueString("Name") + "</b></br/>";
>                               var v:java.util.Vector = document1.getItemValue("Address");
>                               for(var i=0; i<v.size(); i++) {
>                               if(i>0) info += "<br/>"
>                               info += v.elementAt(i)
>                               }
>                               return info;}]]></xc:this.infotext>
>                           <xc:this.title><![CDATA[#{javascript:document1.getItemValueString("Name")}]]></xc:this.title>
>                       </xc:marker>
>                   </xc:this.marker>
>               </xc:ccGoogleMaps>  -->         <div id="map_canvas" style="width:320px; height:400px">             </div>          <xp:scriptBlock id="scriptBlock1">
>               <xp:this.value><![CDATA[var geocoder; // 2013.11.01/Jda - Need to use code directly here instead of from Custom Control - and add
> require at the bottom... function initialize(){
> 
>   geocoder = new google.maps.Geocoder();      var myOptions = {
>       zoom: 10,
>       mapTypeId: google.maps.MapTypeId.ROADMAP
>     };
>     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);      var mapcentertype = "Address";      if(mapcentertype ==
> "Coordinates"){
>       var map_center_latitude = document.getElementById("#{id:hdnMapCenterLatitude}").value;
>       var map_center_longitude = document.getElementById("#{id:hdnMapCenterLongitude}").value;
>       centerMap = new
> google.maps.LatLng(parseFloat(map_center_latitude),parseFloat(map_center_longitude));
>       map.setCenter(centerMap);   }else if(mapcentertype == "Address"){
>       var address = "#{javascript:viewScope.address}";    
>       geocoder.geocode( {'address': address}, function(results, status) { 
>       if(status == google.maps.GeocoderStatus.OK){
>           map.setCenter(results[0].geometry.location);
>       }else{
>           alert("Geocode center was not successful for the following reason: " + status + " -> " + address);      };  });     }else{      alert("You
> forgot to set the property map_center_type.");    }       codeAddress();       
> }
> 
> function codeAddress(){   var valueTitle =
> '#{javascript:document1.getItemValueString("Name")}';     var valueLayer
> = 0;  var valueInfotext = '#{javascript:var info = "<b>" + document1.getItemValueString("Name") + "</b></br/>";
>                               var v:java.util.Vector = document1.getItemValue("Address");
>                               for(var i=0; i<v.size(); i++) {
>                               if(i>0) info += "<br/>"
>                               info += v.elementAt(i)
>                               }
>                               return info;}';     var valueIcon = '';     var valueAddress = "#{javascript:viewScope.address}";   var valueAnimation = "DROP";        var
> valueLocation_type = "Address";   var valueLocation_longitude = 0.0;
>   var valueLocation_latitude = 0.0;       showMap(valueAddress,
> valueAnimation, valueLayer, valueIcon, valueInfotext, valueTitle,
> valueLocation_type, valueLocation_longitude,
> valueLocation_latitude);       }
> 
> function showMap(address, marker_animation, marker_zindex,
> marker_icon, marker_infowindow_text, marker_title,
> marker_location_type, marker_location_longitude,
> marker_location_latitude) {   // Create Marker
>     var marker = new google.maps.Marker({map: map});  if(marker_location_type=="Coordinates"){
>       var myLatLng = new google.maps.LatLng(parseFloat(marker_location_latitude),
> parseFloat(marker_location_longitude));
>       marker.setPosition(myLatLng);
>     }else{        geocoder.geocode( {'address': address}, function(results, status){
>           if (status == google.maps.GeocoderStatus.OK) {    
>               marker.setPosition(results[0].geometry.location); 
>           } else {
>               alert("Geocode was not successful for the following reason: " + status + " -> " + address);
>           }            
>     });    
>     }    
>     
>     // Set the title of the marker
>     if(marker_title != ""){
>        marker.setTitle(marker_title);
>     };
>     // Set the icon of the marker
>     if(marker_icon != ""){
>        marker.setIcon(marker_icon.replace("/",""));
>     };    // Set the z-index of the marker    if(marker_zindex != ""){        marker.setZIndex(parseInt(marker_zindex));  };  // Set the animation
> of the marker     if(marker_animation != ""){        
>       if(marker_animation == "BOUNCE"){
>           marker.setAnimation(google.maps.Animation.BOUNCE);      }else
> if(marker_animation == "DROP"){
>           marker.setAnimation(google.maps.Animation.DROP);        }else{          //
> does not exist        };              };          // Set the infowindow and
> text of the marker    console.log("marker_infowindow_text=" +
> marker_infowindow_text);  if(marker_infowindow_text != ""){       var
> infowindow = new google.maps.InfoWindow({content:
> marker_infowindow_text});             google.maps.event.addListener(marker,
> 'click', function() {             infowindow.open(map,marker);    });     };     }
> 
> function showCircle(center_type, center_address, center_latitude,
> center_longitude, radius, fillColor, fillOpacity, strokeColor,
> strokeOpacity, strokeWeight, visible, zIndex) {
> 
>       if(visible == "false"){         visible = false;    }else{      visible =
> true;     };  //Create Circle     var circle_options = {      map: map,
>       //center: center,       radius: parseInt(radius),       fillColor:
> fillColor.toString(),         fillOpacity: fillOpacity,       strokeColor:
> strokeColor.toString(),       strokeOpacity: strokeOpacity,
>           strokeWeight: strokeWeight,
>           visible: visible,
>           zIndex: zIndex              };      var circle = new google.maps.Circle(circle_options);    if(center_type ==
> "Coordinates"){       circle.setCenter(new
> google.maps.LatLng(parseFloat(center_latitude),
> parseFloat(center_longitude)));   }else{      geocoder.geocode(
> {'address': center_address}, function(results, status) {
>               if (status == google.maps.GeocoderStatus.OK) {
>               circle.setCenter(results[0].geometry.location);     
>               } else {
>                   alert("Geocode of the circle was not successful for the following reason: " + status + " -> " + address);
>               }       });
> 
>   };   }
> 
> require(["dojo/domReady"], function(){     initialize(); });
> ]]></xp:this.value>           </xp:scriptBlock>           </xp:panel>
>       </xe:appPage>

我很抱歉我必须结合使用“blockquote”和“代码示例”来使 XPage 和 JS 看起来合理......

4

1 回答 1

1

可能有一些 dojo 引用,并且在 9 中有使生活更艰难的 amd 加载程序。试着把你放在这个里面的客户端加载代码上。

 require(["dojo/domReady!"], function(){
  // place code here


});
于 2013-10-10T07:59:21.763 回答