OpenLayers学习最好的方式就是跟着其自带的演示样例进行学习,另外对web前端的开发设计要了解,慢慢积累,这样在一般的小项目中应该是足够用了。

本篇參照量測demo实现对话框形式的量測,抛砖引玉,通过这个功能。后面的查询、定位等基于对话框的形式就非常easy实现了。

先看下效果图:

长度測量:

面积測量:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZ2lzZXJfd2h1/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

代码基本都是demo里的代码。就不贴出来了。

这里须要注意的问题是,在关闭窗体的时候一定要使measureTools   deactive

 //測量
$("#Measure").click(function ()
{
$("#measureDialog").dialog(
{
open: function ()
{
clearMeasureText();
},
//关闭測量窗体前使measureTools deactive
beforeClose: function ()
{
deactiveMeasureControl(); },
title: "測量",
resizable: false,
buttons: {
"确定": function ()
{
$(this).dialog("close");
},
"取消": function ()
{
$(this).dialog("close");
}
} }
);
});
function deactiveMeasureControl()
{
for (var key in measureControls)
{
var control = measureControls[key];
control.deactivate();
}
}

OpenLayers学习笔记4——使用jQuery UI实现測量对话框的更多相关文章

  1. OpenLayers学习笔记5——使用jQuery UI实现查询并标注(UI篇)

    近期事情非常多,老板给的压力也非常大.经常出差,另外项目和个人研究还都要跟上,本月要交论文,还要写专利,仅仅能抽时间来学习其它的东西了. 关于OpenLayers的在博客中不会写太多详细的实现(网上有 ...

  2. OpenLayers学习笔记3——使用jQuery UI美化界面设计

    PC端软件在开发是有较多的界面库能够选择,比方DevExpress.BCG.DotNetBar等,能够非常方便快捷的开发出一些炫酷的界面,近期在学习OpenLayers.涉及到web前端开发,在设计界 ...

  3. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  4. Java程序猿的JavaScript学习笔记(9—— jQuery工具方法)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  5. amazeui学习笔记--js插件(UI增强)--警告框Alert

    amazeui学习笔记--js插件(UI增强)--警告框Alert 一.总结 1.警告框基本样式:用am-alert声明div容器, <div class="am-alert" ...

  6. amazeui学习笔记--js插件(UI增强4)--下拉组件Dropdown

    amazeui学习笔记--js插件(UI增强4)--下拉组件Dropdown 一.总结 1.am-dropdown(及其孩子):控制下拉列表的样式 2.data-am-dropdown(及其孩子):控 ...

  7. amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse

    amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse 一.总结 注意点: 1.data-am-collapse:这个东西就是展开折叠事件 2.am-collapse(包括其下属 ...

  8. jquery源码学习笔记三:jQuery工厂剖析

    jquery源码学习笔记二:jQuery工厂 jquery源码学习笔记一:总体结构 上两篇说过,query的核心是一个jQuery工厂.其代码如下 function( window, noGlobal ...

  9. amazeui学习笔记--js插件(UI增强2)--按钮交互Button

    amazeui学习笔记--js插件(UI增强2)--按钮交互Button 一.总结 1.按钮loading状态: <button type="button" class=&q ...

随机推荐

  1. HTTP协议--简析

    HTTP--超文本传输协议(HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议,是所有的www文件都必须遵守的标准. 要想成为优秀的web开发人员,必须熟悉H ...

  2. javascript 中 事件流和事件冒泡

    一.事件流 是描述页面接受事件的顺序,IE 使用的是时间冒泡流;而Netscape的事件采用的是事件捕获流.1.事件冒泡JS 和 HTML是通过事件的方式实现交互.事件冒泡 开始元素,将事件逐级传递, ...

  3. Cocos2d-x 手游聊天系统需求分析

    手游聊天系统需求分析 转载请注明:IT_xiao小巫 移动开发狂热者群:299402133 策划需求图 參考系统:刀塔传奇 点击这个.然后弹出以下的对话框 游戏类型:卡牌 分析:刀塔传奇聊天系统分为3 ...

  4. Custom draw 和 Owner draw 的区别

    "Custom Draw" is a feature shared by all of Microsoft's common controls, which allows you ...

  5. [WP8] Binding时,依照DataType来选择DataTemplate

    原文 [WP8] Binding时,依照DataType来选择DataTemplate 范例下载 范例程序代码:点此下载 问题情景 在开发WPF.WP8...这类应用程序的时候,透过Binding机制 ...

  6. 【Demo 0008】Java基础-抽象类

    本掌学习要点:       1.  了解抽象类的定义及使用场景:       2.  掌握final修饰的类.方法以及变量作用及用法:       3.  掌握abstract 修饰的类及方法作用及用 ...

  7. linux pthread之学习篇

    在应用程序编程中,为了不影响与用户交互的性能,通常需要创建新的线程来处理一些比较耗时的. 不影响用户体验的工作.而这又通常分为两种情况: (1)需要临时创建一个线程来做某件特定的事,等事情做完时线程即 ...

  8. Struts2 学习笔记18 拦截器原理分析

    我们来进行一下拦截器的原理分析,从Struts2的源代码开始,然后我们手动创建一个项目进行模拟.(源代码需要下载然后添加好才能看到)我们可以用Debug来读源码. 从doFilter开始执行,流程如图 ...

  9. 怎么提高ArcGIS for Desktop10.x的性能

    Esri新公布了一篇提高ArcGIS for Desktop10.x的性能的文章.大家能够关注一下 http://support.esri.com/en/knowledgebase/techartic ...

  10. R语言与数据分析之六:时间序列简介

    今年在某服装企业蹲点了4个多月,之间非常长一段时间在探索其现货和期货预測.时间序列也是做销售预測的首选,今天和小伙伴分享下时间序列的基本性质和怎样用R来挖据时间序列的相关属性. 首先读入一个时间序列: ...