自己动手做地图:Dojo中的Map控件详解

2023-12-19 09:30

本文主要是介绍自己动手做地图:Dojo中的Map控件详解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

随着Web成为软件系统交付的主流平台,企业级应用前端纷纷落户浏览器,对各种富客户端开发库提出了越来越高的要求,Dojo作为其中的佼佼者,对企业级Web开发提供了强大的支持。

在企业信息系统中,图表是数据分析的最终图形化结果,地位举足轻重,直接影响数据分析的效果好坏。美观实用的图表绝对会给应用系统加分不少!

 

Dojo控件库里有丰富的图表控件,除了常见的直方图、饼图、折线图等等,也有为更专业的需求而开发的甘特图、散点图、地图等控件。更难能可贵的是Dojo的图表控件支持了动画效果以及众多的UI响应事件。下图是一个包含了dojo中的地图、直方图、饼图和折线图等图表控件的Dashboard示例:

 

 

 

接下来我们以dojo1.5版本中新加入的地图控件(dojox.geo.charting.Map)为例,来认识一下dojo中的图表控件特点(这里默认读者有一定的dojo开发基础,如果没有...也没问题!)


1.简单快捷的创建过程


首先你得下载dojo1.5的开发包 ,然后在html开发页面中引入必要的css文件和dojo.js;


然后新建一张美国地图(dojo中自带的地图就是美国地图)。构造函数接受两个参数:地图div容器以及地图的地理数据。地理数据默认存放在dojox.geo.charting模块下的resources/data目录下;




 

OK, 一张最简单的地图就生成了,而且支持 高亮, 放大,复位和Tip功能:


点击后高亮显示:

再点击,地图放大;在放大状态下点击的话,地图就会复位:

 

可以看到Map图表控件的创建过程非常简单,不过到现在为止,Map还没有跟数据进行绑定,所以不能称为严格意义上的图表,下面介绍Map如何展示数据。


 

2.一目了然的数据展示

 

比如说,现在的需求是显示A产品在美国各州的销售情况,用深蓝色表示销售情况火爆,用浅蓝色代表销售情况惨淡;

销售数据使用dojo.data.ItemFileReadStore数据格式(关于ItemFileReadStore的介绍可以读读《利用 Dojo Data 开发统一的数据访问模型》)

 

 

接下来,就需要为数据设置颜色区间了。我将销售值在6.0到9.0之间设置为销售火爆的地区,用深蓝色表示。佛罗里达州的A产品销售额为7.2,那么佛罗里达州的颜色就是深蓝色;


 

好了,Map的数据展示功能也介绍完了。别忙,还有更cool的呢,那就是dojo图表中的事件扩展接口!



3.强大丰富的扩展接口

 

在基于控件库的开发中,开发者经常需要定制化的功能,所以控件必须提供一些扩展接口满足这部分需要。以Map控件为例,开发者希望能够定制Tip的内容,或者在点击地图的时候触发新的事件等等。在Map控件里一共提供了三个扩展接口,参数都是当前地图上取得焦点的地区。

  1. onFeatureOver:在鼠标移到地区上方时触发
  2. onFeatureClick:在鼠标点击地区时触发;
  3. onZoomEnd:在地区完成放大行为时触发;

下面是自定义的提示内容,只要你愿意,你甚至可以在加州的提示内容里添加湖人队的夺冠新闻。

 

至此,Map控件已经介绍完了,不过dojo图表控件中还有许多优秀的成员等待你去发掘。

 

 

另附示例代码:http://download.csdn.net/source/2544819

 


 






这篇关于自己动手做地图:Dojo中的Map控件详解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/511692

相关文章

MySQL中的分组和多表连接详解

《MySQL中的分组和多表连接详解》:本文主要介绍MySQL中的分组和多表连接的相关操作,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录mysql中的分组和多表连接一、MySQL的分组(group javascriptby )二、多表连接(表连接会产生大量的数据垃圾)MySQL中的

Java 实用工具类Spring 的 AnnotationUtils详解

《Java实用工具类Spring的AnnotationUtils详解》Spring框架提供了一个强大的注解工具类org.springframework.core.annotation.Annot... 目录前言一、AnnotationUtils 的常用方法二、常见应用场景三、与 JDK 原生注解 API 的

redis中使用lua脚本的原理与基本使用详解

《redis中使用lua脚本的原理与基本使用详解》在Redis中使用Lua脚本可以实现原子性操作、减少网络开销以及提高执行效率,下面小编就来和大家详细介绍一下在redis中使用lua脚本的原理... 目录Redis 执行 Lua 脚本的原理基本使用方法使用EVAL命令执行 Lua 脚本使用EVALSHA命令

SpringBoot3.4配置校验新特性的用法详解

《SpringBoot3.4配置校验新特性的用法详解》SpringBoot3.4对配置校验支持进行了全面升级,这篇文章为大家详细介绍了一下它们的具体使用,文中的示例代码讲解详细,感兴趣的小伙伴可以参考... 目录基本用法示例定义配置类配置 application.yml注入使用嵌套对象与集合元素深度校验开发

Python中的Walrus运算符分析示例详解

《Python中的Walrus运算符分析示例详解》Python中的Walrus运算符(:=)是Python3.8引入的一个新特性,允许在表达式中同时赋值和返回值,它的核心作用是减少重复计算,提升代码简... 目录1. 在循环中避免重复计算2. 在条件判断中同时赋值变量3. 在列表推导式或字典推导式中简化逻辑

使用Python和Pyecharts创建交互式地图

《使用Python和Pyecharts创建交互式地图》在数据可视化领域,创建交互式地图是一种强大的方式,可以使受众能够以引人入胜且信息丰富的方式探索地理数据,下面我们看看如何使用Python和Pyec... 目录简介Pyecharts 简介创建上海地图代码说明运行结果总结简介在数据可视化领域,创建交互式地

Java Stream流使用案例深入详解

《JavaStream流使用案例深入详解》:本文主要介绍JavaStream流使用案例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录前言1. Lambda1.1 语法1.2 没参数只有一条语句或者多条语句1.3 一个参数只有一条语句或者多

SpringBoot整合mybatisPlus实现批量插入并获取ID详解

《SpringBoot整合mybatisPlus实现批量插入并获取ID详解》这篇文章主要为大家详细介绍了SpringBoot如何整合mybatisPlus实现批量插入并获取ID,文中的示例代码讲解详细... 目录【1】saveBATch(一万条数据总耗时:2478ms)【2】集合方式foreach(一万条数

Python装饰器之类装饰器详解

《Python装饰器之类装饰器详解》本文将详细介绍Python中类装饰器的概念、使用方法以及应用场景,并通过一个综合详细的例子展示如何使用类装饰器,希望对大家有所帮助,如有错误或未考虑完全的地方,望不... 目录1. 引言2. 装饰器的基本概念2.1. 函数装饰器复习2.2 类装饰器的定义和使用3. 类装饰

MySQL 中的 JSON 查询案例详解

《MySQL中的JSON查询案例详解》:本文主要介绍MySQL的JSON查询的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录mysql 的 jsON 路径格式基本结构路径组件详解特殊语法元素实际示例简单路径复杂路径简写操作符注意MySQL 的 J