（转）WKT转换工具terraformers

http://blog.csdn.net/gisshixisheng/article/details/53150111

概述：

前面的文章中，提到了Arcgis中实现wkt转换为geometry，但是这种转换仅实现了简单的点（point）、线（polyline）和面（polygon）的转换，对于复杂点或者复杂多边形没有涉及，在本文讲述通过terraformers加载展示wkt。

terraformers简介:

terraformers是Esri的一个开源项目，主要功能如下：

大家可通过http://download.csdn.NET/detail/gisshixisheng/9681608下载相关的js文件，也可直接在github上下载，github上的地址为https://github.com/Esri/Terraformer。

实现代码：

1、Arcgis加载WKT

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Hello Map</title>
<link rel="stylesheet" href="http://localhost/arcgis_js_311/api/arcgis_js_api/library/3.11/3.11/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://localhost/arcgis_js_311/api/arcgis_js_api/library/3.11/3.11/esri/css/esri.css"><style>
html, body, #map {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
</style>
<script src="../../plugin/terraformer/terraformer.js"></script>
<script src="../../plugin/terraformer/terraformer-wkt-parser.js"></script>
<script src="../../plugin/terraformer/terraformer-arcgis-parser.js"></script>
<script src="http://localhost/arcgis_js_311/api/arcgis_js_api/library/3.11/3.11/init.js"></script>
<script src="../../plugin/jquery/jquery-1.8.3.js"></script>
<script>
var map;
require([ "esri/map",
"esri/layers/ArcGISTiledMapServiceLayer",
"esri/layers/GraphicsLayer",
"esri/graphic",
"esri/geometry/Point",
"esri/geometry/jsonUtils",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/Color",
"dojo/domReady!"
],
function(Map,
Tiled,
GraphicsLayer,
Graphic,
Point,
geometryJsonUtils,
SimpleMarkerSymbol,
SimpleLineSymbol,
SimpleFillSymbol,
Color){
map = new Map("map");
var tiled = new Tiled("http://localhost:6080/arcgis/rest/services/lzugis/base_china/MapServer");
map.addLayer(tiled);
var mapCenter = new Point(103.847, 36.0473, {"wkid":4326});
map.centerAndZoom(mapCenter,1);
var gLayer = new GraphicsLayer();
map.addLayer(gLayer);
gLayer.on("click",function(feature){
console.log(feature);
});
var wkts = [
"POINT(107.5758285931443 29.7822116459692)",
"LINESTRING(120.18304604073 30.3305841465568,108.805692477062 32.0850224203499)",
"POLYGON((102.797302689433 36.5936423859273,105.519115206186 29.4789248520356,100.346180647351 19.9699202912212))"
];
map.on("load",function(){
for(var i=0,len = wkts.length;i<len;i++){
var primitive = Terraformer.WKT.parse(wkts[i]);
var arcgis = Terraformer.ArcGIS.convert(primitive);
var geometry = geometryJsonUtils.fromJson(arcgis);
var symbol = getSymbol(geometry.type);
var gfx = new Graphic(geometry,symbol);
gLayer.add(gfx);
}
});
function getSymbol(geotype){
var symbol = null;
if(geotype==="point"){
symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 12,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255,0,0]), 1),
new Color([0,0,255,255]));
}
else if(geotype==="polyline"){
symbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255,0,0]), 2);
}
else{
symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
new Color([255,0,0]), 2),new Color([255,255,0,0.25])
);
}
return symbol;
}
});
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>

效果：

2、leaflet加载WKT

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>leaflet</title>
<link rel="stylesheet" href="../../plugin/leaflet/leaflet.css" type="text/css">
<style>
body {
padding: 0;
margin: 0;
}
html, body, #map {
height: 100%;
}
.leaflet-control-attribution{
display: none;
}
</style>
<script src="../../plugin/jquery/jquery-1.8.3.js"></script>
<script src="../../plugin/terraformer/terraformer.js"></script>
<script src="../../plugin/terraformer/terraformer-wkt-parser.js"></script>
<script src="../../plugin/leaflet/leaflet.js"></script>
<script>
var map;
$(window).load(function() {
map = L.map('map').setView([35.851354460363,104.21390114103], 4);//35.851354460363,104.21390114103
var wms = L.tileLayer.wms("http://localhost:8088/geoserver/lzugis/wms", {
layers: 'province',
format: 'image/png',
transparent: true,
version:'1.1.1'
});
map.addLayer(wms);
function onEachFeature(feature, layer) {
var popupContent = "<p>I started out as a WKT " +
feature.type + ", but now I'm a Leaflet vector!</p>";
if (feature.properties && feature.properties.popupContent) {
popupContent += feature.properties.popupContent;
}
layer.bindPopup(popupContent);
}
var wkts = [
"POINT(107.5758285931443 29.7822116459692)",
"LINESTRING(120.18304604073 30.3305841465568,108.805692477062 32.0850224203499)",
"POLYGON((102.797302689433 36.5936423859273,105.519115206186 29.4789248520356,100.346180647351 19.9699202912212))"
];
var geojsons = [];
for(var i=0,len = wkts.length;i<len;i++){
var geojson = Terraformer.WKT.parse(wkts[i]);
geojsons.push(geojson);
}
var layer = L.geoJson(geojsons, {onEachFeature: onEachFeature}).addTo(map);
});
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>

效果：

--------------------------------------------

（转）WKT转换工具terraformers的更多相关文章

Unicode编码解码在线转换工具
// Unicode编码解码在线转换工具 Unicode 是基于通用字符集(Universal Character Set)的标准来发展,并且同时也以书本的形式(The Unicode Standar ...
android px,dp,sp大小转换工具
package com.voole.playerlib.util; import android.content.Context; /** * Android大小单位转换工具类<br/> ...
Json与javaBean之间的转换工具类
/** * Json与javaBean之间的转换工具类 * * {@code 现使用json-lib组件实现 * 需要 * json-lib-2.4-jdk15.jar * ...
Rsa加解密Java、C#、php通用代码密钥转换工具
之前发了一篇"TripleDes的加解密Java.C#.php通用代码",后面又有项目用到了Rsa加解密,还是在不同系统之间进行交互,Rsa在不同语言的密钥格式不一样,所以过程中主 ...
ubuntu下编码转换工具
ubuntu打开windows下的txt或者代码文件,经常会出现乱码, ubuntu自带一种转换工具,是命令行的,下面提供一种最简单的方法进行转换比如要转换的文件为1.txt,进入1.txt的目录 ...
日期转换工具类 CommUtil.java
package com.util; import java.text.ParseException; import java.text.SimpleDateFormat; import java.ut ...
视频转换工具 Transmageddon
点这里 Transmageddon 是一个采用 Python 语言开发的视频转换工具,支持输出几乎所有的视频格式,同时也可以生成指定平台下的视频格式. 软件界面如下图所示
Base64 图片转换工具
以前在写asp的后台的时候,有一个上传功能是必须的,那时候进行的图片预览(未上传前)其实就是获取本地的图片路径来显示图片,但是随着HTML5的出现,可以把图片通过编码来实现预览. 在雅虎的36条速度优 ...
web字体格式及几种在线格式转换工具介绍
原文地址:http://blog.csdn.net/xiaolongtotop/article/details/8316554 目前,文字信息仍是网站最主要的内容,随着CSS3技术的不断成熟,Web字 ...

随机推荐

何时、怎样开启 MySql 日志？
假如你是一名 web 开发者.假设你想调试你的应用或提升其性能的话,那你须要去參考各种日志文件.日志是開始故障排除最好的选择.就著名的 MySql 数据库server而言,你须要參考下面日志文件: 错 ...
Vijos P1023Victoria的舞会3【贪心+DFS求强联通分量】
链接:Click Me! P1023Victoria的舞会3 Accepted 标签:Victoria的舞会[显示标签] 描写叙述 Victoria是一位颇有成就的艺术家,他因油画作品<我爱北京 ...
PCCs系数
package ai; public class pccs { public static void main(String[] args) { double same[][]=new double[ ...
TMS320F28335项目开发记录6_28335之cmd文件具体解释
1.CMD文件的作用 CMD文件的作用就像仓库的货物摆放记录一样,为程序代码和数据分配指定的空间. 2.C语言生成的段 C语言生成的段大致分为两大类:初始化和未初始化,已初始化的段含有真正的指令和数据 ...
python 爬虫必知必会
#python爬虫 #新闻数据 #机器学习:股票数据获取及分析 #网络搜索引擎的一个部件 #Http协议 #正则表达式 #多线程,分布式 #http报文展示 #Http 应答报文介绍 #1.应答码 # ...
c# DataGridView样式设置无效
对DataGridView中的某些行设置样式时,无效,最后发现,我是先设置完样式再进行展现的this.controls.Add,应该先展现完了,再设置样式.
【OI】关于快速幂的简单理解
都知道算某个数的幂需要线性的复杂度,为了优化复杂度,就出现了所谓的快速幂. 快速幂的代码很短,但是要原理需要一点心思. 首先,我们知道, a^b = a^c * a^d (c+d=b) 那么,不就可以 ...
C#中，JSON字符串转换成对象。
在前台提交(post)的数据中.除了强类型的数据外,还有一个额外的json数据提交在这里我的办法是,在前台把json对象转换成字符串,然后提交. 测试demo 前台: @using(Html.Beg ...
如何在Java生态圈选择一个轻量级的RESTful框架？
在微服务流行的今天,我们会从纵向和横向分解代码的逻辑,将一些独立的无状态的代码单元实现为微服务,可以将它们发布到一些分布式计算单元或者Docker中,并在性能需要的时候及时地创建更多的服务单元.微服务 ...
2-3 原生小程序 - 项目app.json配置
App.json它其实有四五个配置,但是最重要的是pages.windows和tabbar.tabbar是做导航的处理的. 官方推荐的入门配置之一: app.json 它其实有一些字段是限制了这个格式 ...

（转）WKT转换工具terraformers

（转）WKT转换工具terraformers的更多相关文章

随机推荐

热门专题