...
这使得超级控件可以将各种的效果嵌入到表单中，比如：日历、词云、地图、甚至三维模型嵌入进去，所以，叫它超级控件，比如这样的效果：
图-利用超级控件嵌入日历
还是先举一个例子吧，在DWF内部提供了一个地图控件，但是我们希望显示一个3D地图，比如这样：
图-利用超级控件嵌入三维地球地图
或者，这样的效果
图-利用超级控件嵌入日历
“切~，不就是一个iframe嵌入嘛，有什么了不起“，一般有点”水平“的前端程序员们都能做，的确，自超级控件一开始的时候也就是这么一回事，但是....
你把超级控件想简单了，一放到实践中被实际需求按在地上摩擦，你就会发现一堆问题，比如：
怎么办？这时候就可以用超级控件来做了，好消息是百度地图已经实现了一个三维地球模型的库，只要申请一个百度的开发者账号，并且建立地图应用，就可以获得开启三维地图的秘钥，关于百度开发者授权可参见：
http://lbsyun.baidu.com/index.php?title=FAQ/authentication
获得详细的帮助，申请地图应用成功以后，界面如下所示：
图-获得百度地图开发者授权与秘钥
获得许可以后，即可用下面的代码开启三维地图，如果读者有兴趣也可以去百度地图的示例页面查看三维地图的效果：三维地球
| 代码块 | ||||
|---|---|---|---|---|
| ||||
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=？？？？？？"></script> --注意：这里要换成你的AK
<title>地球模式</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// GL版命名空间为BMapGL
var map = new BMapGL.Map("allmap"); // 创建Map实例
map.centerAndZoom(new BMapGL.Point(118.5, 27.5), 5); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
map.setMapType(BMAP_EARTH_MAP); // 设置地图类型为地球模式
</script> |
上述代码本质上是一个html页面，只是在script标签里增加了一个对百度地图和秘钥的标签，然后在最后按照百度地图的API初始化了一个三维地球模式的地图而已。
接下来，在DWF里面建立一个空白页面，将超级控件拖入，设置一下高度，将上述代码拷贝（再次提醒，记得修改第9行的秘钥，进去运行，即可看到下面的效果：
“切~，不就是一个iframe嵌入嘛，有什么了不起“，一般有点”水平“的前端程序员们都能做，
的确，自超级控件一开始的时候也就是这么一回事，但是....，你把超级控件想简单了，
因为，一开始好像不怎么复杂的东西一放到实践中被实际需求按在地上摩擦，你就会发现一堆问题，比如：
- 我能在操作里给超级控件传递数据吗？
- 我怎么将数据加载到这个超级控件里？
- 超级控件能得到表单里的其他控件并且控制他们的行为吗？
- 超级控件能够在用户点击的时候弹出你DWF的表单吗？
所以，超级控件内部其实还有一些技能，一般不做到这个份上，是不会想到滴所以，超级控件内部其实还有一些技能，一般细节不做到这个份上，是不会想到滴....，好，接下来就说一下这些技能，还是举一个例子吧，比如我们希望实现这样的效果：
...