Extjs怎样使用OpenStreetMap解决方法
日期：2014-05-16 浏览次数：20709 次
Extjs怎样使用OpenStreetMap
如题，怎样把openStreetMap显示在Extjs写的页面上，求赐教
------解决方案--------------------
这个如果ExtJs没有这样的接口的话，估计不好实现吧，
用现有的框架总是会有制约的。
------解决方案--------------------
其实很简单，将ext对象首先生成到DOM树中，然后再创建地图对象，参数为ext对象.body.dom，进行一些地图设置就好了
下面是一个大概的示例，将openstreetmap生成到EXT.Window对象里面，ext是3.0的
如题，怎样把openStreetMap显示在Extjs写的页面上，求赐教
------解决方案--------------------
这个如果ExtJs没有这样的接口的话，估计不好实现吧，
用现有的框架总是会有制约的。
------解决方案--------------------
其实很简单，将ext对象首先生成到DOM树中，然后再创建地图对象，参数为ext对象.body.dom，进行一些地图设置就好了
下面是一个大概的示例，将openstreetmap生成到EXT.Window对象里面，ext是3.0的
- HTML code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>GMap Window Example</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="http://www.openstreetmap.org/assets/application-fdbeb1704cd97b247d0fd7c64d262b59.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function () {
var button = Ext.get('show-btn'), mapwin,map;
button.on('click', function () {
if (!mapwin) {
mapwin = new Ext.Window({
layout: 'fit',
title: 'GMap Window',
closeAction: 'hide',
width: 800,
height: 600
,resizable :false
});
mapwin.show();
map = createMap(mapwin.body.dom);
var centre = new OpenLayers.LonLat(11.289667987826276, 51.36946561104731),zoom = 17;
setMapCenter(centre, zoom);
setMapLayers("C");
} else
mapwin.show();
});
});
</script>
<input type="button" id="show-btn" value="打开OpenStreetMap" /><br /><br />
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
