zoukankan      html  css  js  c++  java
  • 7、连接sql数据库获取坐标绘制Graphics

    连接sql数据库获取坐标绘制Graphics

    1、 建立数据库,存储点位信息如下:

    数据库名称:SDB;

    表名称:SDB_Node

    NodeID X Y

    1 33 33

    2 100 100

    3 44 100

    2、 连接数据库,读取信息!

    本例采用将后台读取的坐标信息按照一定格式拼接成字符串的形式传回js,然后再在js中将字符串中的坐标信息截成单个的坐标,然后绘制Graphic

    注意,因为js是前台代码,所以要在后台建一个公共的字符串存储坐标信息。

    public string XY = "";//存储坐标信息 
    
    protected void conn() 
    
    { 
    
    string SConnstr = ConfigurationSettings.AppSettings["SDB_conn"]; 
    
    SqlConnection Sqlconn = new SqlConnection(SConnstr); 
    
    Sqlconn.Open(); 
    
    string div_sqlstr = "select X,Y from SDB_node"; 
    
    SqlCommand mycommand = new SqlCommand(div_sqlstr, Sqlconn); 
    
    SqlDataReader myReader = mycommand.ExecuteReader(); 
    
    while(myReader.Read()) 
    
    { 
    
    XY = myReader["X"] +","+ myReader["Y"]+";"+XY; 
    
    } 
    
    Response.Write(XY); 
    
    Sqlconn.Close(); 
    
    } 

    程序中的string XY便是坐标信息,在前台js中接受。

    3、 前台接收字符串,并处理获取到单个坐标:

    以下是添加点的处理:

    点击按钮后触发事件:

    function toXY_onclick() 
    
    { 
    
    var myvalue="<%=XY%>"//获取坐标字符串 
    
    while(myvalue!="")//判断是否截取完毕 
    
    { 
    
    var d_position=myvalue.indexOf(",")//获取字符串长度 
    
    var X_Str=myvalue.substring(0,d_position);//截取“,”前的字符串,即为X坐标 
    
    var f_position=myvalue.indexOf(";") 
    
    var Y_Str=myvalue.substring(d_position+1,f_position);//截取“;”前的字符串,即为Y坐标 
    
    myvalue=myvalue.substring(f_position+1,myvalue.length); 
    
    var cPoint=new esri.geometry.Point()//定义点 
    
    cPoint.x=X_Str;//为点赋予坐标 
    
    cPoint.y=Y_Str; 
    
    map.centerAt(cPoint);//以该点为中心显示 
    
    addGeometry(cPoint);//调用公共函数addGeometry执行添加点操作 
    
    } 
    
    } 

    公共函数addGeometry()编写:

    function addGeometry(Geo) 
    
    { 
    
    var symbol;//定义样式 
    
    switch (Geo.type) { 
    
    case "point": 
    
    symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25])); 
    
    break; 
    
    case "polyline": 
    
    symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255,0,0]), 1); 
    
    break; 
    
    case "polygon": 
    
    symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25])); 
    
    break; 
    
    case "extent": 
    
    symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25])); 
    
    break; 
    
    case "multipoint": 
    
    symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND, 20, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0,0,0]), 1), new dojo.Color([255,255,0,0.5])); 
    
    break; 
    
    } 
    
    var graphic = new esri.Graphic(Geo, symbol);//将geometry赋予样式并成为Graphics 
    
    map.graphics.add(graphic);//执行添加 
    
    } 

    4、 添加线:

    线的添加使用线的addPath方法,其参数可以是坐标点集、坐标数组等;

    实现代码为(使用坐标数组):

    //添加线 
    
    function addline_onclick() { 
    
    var cLine=new esri.geometry.Polyline(); 
    
    var myvalue="<%=XY%>" 
    
    var iarry=new Array(); 
    
    var i=0; 
    
    while(myvalue!="") 
    
    { 
    
    iarry[i]=new Array(); 
    
    var d_position=myvalue.indexOf(",") 
    
    var X_Str=myvalue.substring(0,d_position); 
    
    var f_position=myvalue.indexOf(";") 
    
    var Y_Str=myvalue.substring(d_position+1,f_position); 
    
    myvalue=myvalue.substring(f_position+1,myvalue.length); 
    
    iarry[i][0]=X_Str; 
    
    iarry[i][1]=Y_Str; 
    
    i++; 
    
    } 
    
    cLine.addPath(iarry); 
    
    addGeometry(cLine); 
    
    } 

    5、 添加面同添加线,其赋予坐标的方法为:addRing

    主要代码为:

    function addpolygon_onclick() { 
    
    var cPolygon=new esri.geometry.Polygon(); 
    
    var iarry=new Array(); 
    
    var myvalue="<%=XY%>" 
    
    var iarry=new Array(); 
    
    var i=0; 
    
    while(myvalue!="") 
    
    { 
    
    iarry[i]=new Array(); 
    
    var d_position=myvalue.indexOf(",") 
    
    var X_Str=myvalue.substring(0,d_position); 
    
    var f_position=myvalue.indexOf(";") 
    
    var Y_Str=myvalue.substring(d_position+1,f_position); 
    
    myvalue=myvalue.substring(f_position+1,myvalue.length); 
    
    iarry[i][0]=X_Str; 
    
    iarry[i][1]=Y_Str; 
    
    i++; 
    
    } 
    
    cPolygon.addRing(iarry); 
    
    addGeometry(cPolygon); 
    
    } 

    6、 程序效果图:

    clip_image002

  • 相关阅读:
    Cocos2d-x学习之---自定义图标(带触摸事件)
    Cocos2d-x关于ScrollView
    学习实战三:基于Cocos2d-x引擎模仿微信打飞机游戏
    补算法相关知识一:蚂蚁算法
    避免Cocos2d-x编写的游戏在用eclipse生成安卓包时繁琐的写Android.mk文件
    Cocos2d-x学习之---模仿微信打飞机游戏敌机层设计初想
    Cocos2d-x学习之---2013年10月11日小记
    有时候真怕,时间会说出真心话。
    NO2:设置RedHat Linux下的samba开机启动
    NO1:在Windows端安装SecureCRT来连接Linux
  • 原文地址:https://www.cnblogs.com/dwf07223/p/3048076.html
Copyright © 2011-2022 走看看