<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>通过属性查询地图服务中的信息</title> <link rel="stylesheet" href="https://js.arcgis.com/3.39/esri/css/esri.css"> <!-- <link rel="stylesheet" type="text/css" href="./css/esri.css" /> --> <link rel="stylesheet" href="https://js.arcgis.com/3.40/esri/themes/calcite/dijit/calcite.css"> <script src="https://js.arcgis.com/3.41/"></script> <script> require(["esri/map", //加载地图组件 "dojo/dom", "dojo/on", "esri/InfoTemplate", "esri/graphic", "esri/geometry/Point",//加载点对象组件 "esri/symbols/SimpleMarkerSymbol", "esri/geometry/Extent",//加载范围组件 "esri/layers/FeatureLayer", //加载FeatureLayer地图组件 // "esri/dijit/FeatureTable", "esri/layers/WebTiledLayer", //加载切片地图组件 "esri/layers/ArcGISDynamicMapServiceLayer",//加载动态地图组件 "esri/symbols/SimpleFillSymbol", "esri/renderers/UniqueValueRenderer", "esri/tasks/query", "esri/tasks/QueryTask", "esri/Color", "dojo/domReady!" ], function (Map, dom, on, InfoTemplate, Graphic, Point, SimpleMarkerSymbol,Extent, FeatureLayer, WebTiledLayer, ArcGISDynamicMapServiceLayer, SimpleFillSymbol, UniqueValueRenderer, Query, QueryTask, Color, GeoJsonLayer) { //初始化地图容器 // map = new Map("map", { logo: false, slider: false }, {zoom: 8}); map = new Map("map", { center: [109.33789 , 29.57985], basemap: "satellite", zoom: 10, sliderStyle: "small", logo: false }); // 创建底图 var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"); map.addLayer(basemap,0); // 创建动态图层 var dynamicLayer = new ArcGISDynamicMapServiceLayer("http://116.62.63.94:6080/arcgis/rest/services/sanhuxiangtest/MapServer"); map.addLayer(dynamicLayer,99); }) </script> </head> <body class="tundra"> <div id="map" style="width:900px; height:580px; border:1px solid #000;"></div> 类别名称:<input class="nm" type="text"> </body> </html>
时间: 2023-12-02 19:06:12 浏览: 91
这段代码是一个简单的HTML页面,用于通过属性查询地图服务中的信息。以下是代码的主要部分:
1. 引入必要的CSS和JavaScript库:代码中使用了ArcGIS API for JavaScript的版本3.41,并引入了其他必要的库文件。
2. 初始化地图:使用`new Map("map", options)`创建一个地图容器,其中`options`包含了地图的一些设置,例如中心点、底图、缩放级别等。
3. 创建底图和动态图层:使用`new ArcGISTiledMapServiceLayer(url)`创建一个底图,以及使用`new ArcGISDynamicMapServiceLayer(url)`创建一个动态图层。这些图层可以通过URL指定,以加载地图数据。
4. 将图层添加到地图上:使用`map.addLayer(layer, index)`方法将底图和动态图层添加到地图上。`index`参数可选,用于指定图层的显示顺序。
在页面中还有一个输入框,用于输入类别名称。您可以在页面加载完成后,通过属性查询来过滤地图服务中的信息。
请注意,该代码使用的是ArcGIS API for JavaScript版本3.x,而不是最新版本的4.x。如果您要使用最新版本的API,请相应地修改代码。另外,确保替换URL和其他参数以适应您自己的地图服务和需求。
相关问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Error</title> </head> <body> <pre>Cannot POST /</pre> </body> </html>
<!DOCTYPE html>是一个HTML5文档的声明,它告诉浏览器这是一个使用标准通用标记语言(SGML)的文档,并且使用HTML5的规范。在给定的代码片段中,这位于HTML文档的开头,用于指示文档类型。
`<html lang="en">` 表示整个文档的语言是英语(en)。
`<head>` 部分包含了页面的元信息,如字符集 `<meta charset="utf-8">`,设置了文档的编码为UTF-8,这对于支持各种字符的网页非常重要。`<title>Error</title>` 定义了浏览器标签页上显示的标题,这里显示的是"Error"。
`<body>` 标签下的内容是用户看到的实际页面内容。在这个例子中,`<pre>Cannot POST /</pre>` 是一个预格式化文本块,通常用于显示代码或错误消息。"Cannot POST /" 显然是一个HTTP错误提示,表示尝试向服务器发送POST请求到"/"路径时发生了问题,可能是因为该URL无法处理POST请求或者是请求方法被服务器明确禁止。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Not found</title> </head> <body> <h1>Not found</h1> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Not found</title> </head> <body> <h1>Not found</h1> </body> </html>是一个HTML页面模板,它是一个简单的404页面,用于显示“Not found”错误信息。在这个模板中,<!DOCTYPE html>定义了文档类型,<html>标签定义了HTML文档的根元素,<head>标签定义了文档的头部部分,<meta charset="UTF-8">指定了文档的字符编码为UTF-8,<title>标签定义了文档的标题,<body>标签定义了文档的主体部分,<h1>标签定义了一个一级标题。
阅读全文