Question

我正在使用Appcelerator Alloy。我有一个带有几个注释的地图，下面有一个Web视图。我希望能够在地图上选择注释，并让Web视图显示基于该注释的网页。

例如，选择白俄罗斯注释，网络视图显示白俄罗斯的维基百科页面。

到目前为止，这是我的大致内容：

Map.xml

<Alloy>
<Window title="Map">
    <Module method="createView" module="ti.map"  id="mapview" height="250" top="0" >
        <Annotation id="belarus" onClick="refresh" url="https://en.wikipedia.org/wiki/Belarus" />
        <Annotation id="belgium" />
        <Annotation id="bosniaAndHerzegovina" />
        <Annotation id="bulgaria" />
    </Module>
    <WebView id="webview" url="https://en.wikipedia.org/wiki/Austria" top="252" />
</Window>

（Js比任何东西都更伪代码，因为我不确定究竟应该去哪里） Map.Js

function refresh(){
//set url based on which annotation was selected
var url = $.this.url;

if(url != null){
    //update the web view with the new url
$.webview.reload(url);  };

Answer 1

如果您查看文档，您将找到答案：

在http://docs.appcelerator.com/platform/latest/#!/api/Modules.Map，您会看到一个带有注释点击的示例：

mapview.addEventListener('click', function(evt) {
    Ti.API.info("Clicked " + evt.clicksource + " on " + evt.latitude + "," + evt.longitude);
});

并在网页浏览页面上显示：http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.WebView 您可以看到需要设置url来更改网络视图。

所以在上面的click事件中你会做类似的事情：

$.webview.url = "https://...";

它将加载页面。检查clicksource ID以查看单击了哪个注释

Answer 2

原来这是一个相当简单的错误。不是将onCLick调用放在注释上，而应该放在地图模块本身上。

.XML代码

<Alloy>
<Window title="Map">
    <Module method="createView" module="ti.map"  onClick="refresh" id="mapview" height="250" top="0" >
        <Annotation id="belarus" />
        <Annotation id="belgium" />
        <Annotation id="bosniaAndHerzegovina" />
        <Annotation id="bulgaria" />
    </Module>
    <WebView id="webview" url="https://en.wikipedia.org/wiki/Austria" top="252" />
    </WebView>
</Window>

.js代码

function refresh(evt){
var url = evt.annotation.url;
$.webview.url = url;};

miga对webview网址非常有帮助。

通过选择地图注释更新Web视图

2 个答案: