描述

这个示例展示了在用户单击地图时如何在InfoWindow中显示信息。信息窗口是一个dijit (Dojo widget).信息窗口能够包含文本，字符，图片和任何通过HTML表示的事物。这个例子在信息窗口中显示地图和鼠标单击的屏幕坐标。

注意一旦地图被创建，信息窗口属性立即可用。例如，这行代码明确地设置信息窗口的大小：

map.infoWindow.resize(195, 75);

能够选择显示信息窗口的操作类型。在本例中，地图单击显示信息窗口。为onClick事件增加监听器:

dojo.connect(map, "onClick", addPoint);

每当地图被单击，上面的代码行调用addPoint函数。该函数用setTitle 和 setContent方法来指定显示在窗口中的内容。注意传入addPoint函数的evt参数包含地图和屏幕坐标。这是很重要的因为信息窗口需要在屏幕坐标上定位。因此用来显示信息窗口的代码行传递evt.screenPoint：

map.infoWindow.show(evt.screenPoint);

  <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">

 <html>

   <head>

     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <meta http-equiv="X-UA-Compatible" content="IE=7" />

     <title>ArcGIS Online tiled maps.</title>

     <link rel="stylesheet" type="text/css" href="styles.css"

           href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">

     <link rel="stylesheet" type="text/css" href="styles.css"

           href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/soria/soria.css">

     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>

     <style type="text/css">

         #pic{

             max-width:100px;

             max-height:100px;

         }

         .infowindow .window .top .right .user .titlebar .title{

             font-family: Arial,Helvetica,sans-serif;

             font-weight: bold;

             font-size: 14pt;

         }

         .infowindow .window .top .right .user.content{

             font-style: italic;

             font-size: 10pt;

         }

     </style>

     <script type="text/javascript">

         dojo.require("esri.map");

         var map;

         function init(){

         map=new esri.Map("map");

         dojo.connect(map,"onLoad",function(map){//第一个或基础图层被成功添加到地图时触发事件。

             map.infoWindow.resize(250,200);//设置窗口大小

         }); 

           var tiledMapServiceLayer=new esri.layers.ArcGISTiledMapServiceLayer(

             "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer"

         );

         map.addLayer(tiledMapServiceLayer);

         dojo.connect(map,"onClick",addPoint);  

         }

         function addPoint(event){

             map.infoWindow.setTitle("Coordinates(坐标)");

             map.infoWindow.setContent("lat/lon:"+event.mapPoint.y+","+event.mapPoint.x+

                 "<br/>screen x/y :"+event.screenPoint.x+","+event.screenPoint.y+"</br>"+"<img id='pic' src='images/ld.gif'/>");

             map.infoWindow.show(event.screenPoint,map.getInfoWindowAnchor(event.screenPoint));

         }

         dojo.addOnLoad(init);

     </script>

   </head>

   <body class="tundra">

       <table>

           <tr>

               <td>

                  <div  id="map" class="soria" style="position:relative;width:900px;height:600px;border:1px solid #000">

                      <span id="scale" style="position:absolute;right:10px;bottom:10px;z-index:100;color:white"></span>

                  </div>

               </td>

           </tr>

       </table>

   </body>

 </html>

ArcGIS api for javascript——显示一个信息窗口的更多相关文章

  1. ArcGIS api for javascript——显示多个查询结果

    描述 本例展示了在重叠的多边形处理查询的一种方式.单击一个石油和天然气的字段来查看地图上的高亮显示.如果仅仅点击一个要素,能够在单击一次来查看包含一些属性的InfoWindow.如果偶然单击到重叠的要 ...

  2. ArcGIS api for javascript——显示地图属性

    描述 本例展示了如哦读取地图和图层的属性和返回信息给用户.本例中的四个按钮允许用户接收地图属性.每个按钮调用不同的函数. ·Get All Map Layers - 这个按钮调用getMapLayer ...

  3. ArcGIS api for javascript——显示多个ArcGIS Online服务

    描述 本例展示了如何使用按钮在地图里的两个不同的图层间切换.所有地图里的图层恰巧是来自ArcGIS Online的ArcGISTiledMapServiceLayers.按钮是Dojo dijit按钮 ...

  4. ArcGIS api for javascript——查询，立刻打开信息窗口

    描述 本例展示了当一个要素被查询时如何立刻打开一个InfoWindow.信息窗口能被用来将要素的属性格式化成用户易读的格式. 本例中,地图和查询任务都使用ESRI sample server上的服务K ...

  5. ArcGIS api for javascript——地理编码任务-地理编码地址

    描述 本例允许用户输入一个地址,然后显示匹配的地址的位置.这通常地被称为地理编码.在ArcGIS JavaScript API中,使用Locator类执行地理编码. 定位器构造函数需要ArcGIS S ...

  6. Google Maps API V3 之绘图库 信息窗口

    Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...

  7. ArcGIS API for JavaScript使用中出现的BUG（1）

    本人在使用ArcGIS API for JavaScript开发一个地图的搜索框时,总是出现一个BUG.如图所示: 搜索框总是出不来. 该引用的也引用了,找了半天终于解决,是因为路径没有定义详细. 应 ...

  8. ArcGIS api for javascript——加载查询结果，悬停显示信息窗口

    转自原文 ArcGIS api for javascript——加载查询结果,悬停显示信息窗口 描述 本例在开始和地图交互前执行一个查询任务并加在查询结果.这允许用户鼠标悬停在任意郡县时立即见到Inf ...

  9. arcgis api for javascript 学习（三） 调用发布地图信息，并将地图属性信息输出到Excel表中

    吐血推荐:网上搜了很久关于webgis地图属性表输出到Excel表,并没能找到相关有价值的信息,在小白面前,这就是一脸懵x啊!网上要么是关于前端如何在页面上直接导出excel,和webgis半毛钱关系 ...

随机推荐

  1. 解决IE7、IE8样式不兼容问题

    方法:要在页面中加入如下HTTP meta-tag: <meta http-equiv="X-UA-Compatible" content="IE=EmulateI ...

  2. pic减法进位问题

    1.pic指令中subwf是 F - Wreg,且如果F>=Wreg,则C=1:如果F<Wreg,则C=0:这是由于pic的减法是加上减数的补码实现的.例如3-2,其实是3+FE=01,进 ...

  3. php 基础------数组过滤

    array_filter();过滤数组 语法: array_filter(array,callbackfunction); array 必写,规定要过滤的数组 callbackfunction 必写, ...

  4. 3ds Max制作厨房贴图和纹理实例

    来源:CG游 使用软件:3ds Max 软件下载:www.xy3dsmax.com/xiazai.html 大家好,欢迎大家来阅读这个教程.这个教程是讲解我前不久制作的一个场景效果图.因为场景已经制作 ...

  5. mariadb数据库基础知识及备份

    数据库介绍 1.什么是数据库? 简单的说,数据库就是一个存放数据的仓库,这个仓库是按照一定的数据结构(数据结构是指数据的组织形式或数据之间的联系)来组织,存储的,我们可以通过数据库提供的多种方法来管理 ...

  6. iOS技术栈-Swift版

    在网上没找到基于Swift的技术栈介绍,或者技术已经不适用,所以自己画了一个,后面的博客中会重新整理基于Swfit的UI控件介绍和常用第三方库地图

  7. STM32是如何进入中断服务函数xxx_IRQHandler的

    今天在看stm32的中断,一时间不理解stm32主函数是如何进入中断函数的,按C编程的理解,会有个特定的入口之类的,但是看demo过程中没有发现入口. 以串口中断服务函数void USART1_IRQ ...

  8. LaTeX 矩阵

    本系列文章由 @YhL_Leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/50054363 LaTeX 写矩阵,需要 ...

  9. vim 常用变量

    为了vim更好的支持python写代码,修改tab默认4个空格有两种设置方法: 1. vim /etc/vimrc 1 set ts=4 2 set sw = 4 2. vim /etc/vimrc ...

  10. Android使用Fragment，不能得到Fragment内部控件，findViewById()结果是Null--已经解决

    程序很easy.好长时间没有搞定.郁闷.... . .... . . . 在论坛咨询,最终找到答案. 描写叙述: 一个Activity:MainActivity.内部是一个Fragment:Fragm ...