Giter Club home page Giter Club logo

wzwzwz555

<!doctype html>

<title>下属行政区查询</title> <style type="text/css"> html,body,#container{ height:100%; } </style>

下属行政区查询

省市区
地级市
区县
街道
                	<div class="imgBox">
                		<img src="" style="width:100%;" />
                	</div>
                </div><img id="leftLate" src="/Content/images/small_left.png" />
                <div style="width: 200px; float: left;overflow: hidden;height: 60px;"><div class="infoImg" style="width:' + infoImgLen * 70 + 'px">
                	'<img src=' + data.BridgeImage[j].ImagePath[i].ImageUrl + ' title=' + title + ' />'
                </div></div><img id="rightLate" src="/Content/images/small_right.png" />
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=147251588ca93141a5efd74af8470475&plugin=AMap.DistrictSearch"></script> <script type="text/javascript"> var map, district, polygons = []; var citySelect = document.getElementById('city'); var districtSelect = document.getElementById('district'); var areaSelect = document.getElementById('street');
map = new AMap.Map('container', {
    resizeEnable: true,
    center: [116.30946, 39.937629],
    zoom: 3
});
//行政区划查询
var opts = {
    subdistrict: 1,   //返回下一级行政区
    showbiz:false  //最后一级返回街道信息
};
district = new AMap.DistrictSearch(opts);//注意:需要使用插件同步下发功能才能这样直接使用
district.search('**', function(status, result) {
    if(status=='complete'){
        getData(result.districtList[0]);
        
    }
});




function getData(data,level) {
    var bounds = data.boundaries;
    if (bounds) {
        for (var i = 0, l = bounds.length; i < l; i++) {
            var polygon = new AMap.Polygon({
                map: map,
                strokeWeight: 1,
                strokeColor: '#0091ea',
                fillColor: '#80d8ff',
                fillOpacity: 0.2,
                path: bounds[i]
            });
            polygons.push(polygon);
        }
        map.setFitView();//地图自适应
    }
   
    //清空下一级别的下拉列表
    if (level === 'province') {
        citySelect.innerHTML = '';
        districtSelect.innerHTML = '';
        areaSelect.innerHTML = '';
    } else if (level === 'city') {
        districtSelect.innerHTML = '';
        areaSelect.innerHTML = '';
    } else if (level === 'district') {
        areaSelect.innerHTML = '';
    }

    var subList = data.districtList;
    debugger
    if (subList) {
        var contentSub = new Option('--请选择--');
        var curlevel = subList[0].level;
        var curList =  document.querySelector('#' + curlevel);
        curList.add(contentSub);
        for (var i = 0, l = subList.length; i < l; i++) {
            var name = subList[i].name;
            var levelSub = subList[i].level;
            var cityCode = subList[i].citycode;
            contentSub = new Option(name);
            contentSub.setAttribute("value", levelSub);
            contentSub.center = subList[i].center;
            contentSub.adcode = subList[i].adcode;
            curList.add(contentSub);
        }
    }
    
}





function search(obj) {
    debugger
    //清除地图上所有覆盖物
    for (var i = 0, l = polygons.length; i < l; i++) {
        polygons[i].setMap(null);
    }
    var option = obj[obj.options.selectedIndex];
    var keyword = option.text; //关键字
    var adcode = option.adcode;
    district.setLevel(option.value); //行政区级别
    district.setExtensions('all');
    //行政区查询
    //按照adcode进行查询可以保证数据返回的唯一性
    district.search(adcode, function(status, result) {
        if(status === 'complete'){
            getData(result.districtList[0],obj.id);
        }
    });
}




function setCenter(obj){

    debugger
    map.setCenter(obj[obj.options.selectedIndex].center)
}
</script> <script type="text/javascript" src="https://webapi.amap.com/demos/js/liteToolbar.js"></script>

我在王者网站5's Projects

pipiname icon pipiname

根据三才五格,从诗经、楚辞、论语、周易、唐诗、宋词给宝宝取名

vue-ssr-blog icon vue-ssr-blog

这是一个用Vue驱动的个人技术博客。前台使用vue-ssr进行服务端渲染,后台管理使用vue进行客户端渲染。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.