iframe-proxy | Sunbelt Computer Software

118 lines (111 loc) · 3.98 KB
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>CartoCSS_Point</title>
    <style type="text/css">
        body {
            margin: 0;
            overflow: hidden;
            background: #fff;
        #map {
            position: relative;
            height: 553px;
            border: 1px solid #3473b7;
        #text{
            background-color: #bbbbbb;
            font-size: 20px;
            padding-top: 5px;
            padding-bottom: 5px;
        #cartoContainer{
            position: absolute;
            top: 30px;
            right: 10px;
        input{
            margin-left: 15px;
        img{
            margin-left: 2px;
            height: 30px;
            width: 30px
        #firstImg{
            margin-left: 5px;
        #lastInput{
            margin-left: 16px;;
    </style>
    <!--<link href='./css/bootstrap.min.css' rel='stylesheet' />-->
    <!--<link href='./css/bootstrap-responsive.min.css' rel='stylesheet' />-->
    <script src='../libs/SuperMap.Include.js'></script>
    <script type="text" id="textData">
        #World_Continent__China400{
        polygon-fill:#666;
        #China_Capital_P__China400{
        point-file:<%=pointFile>;
        point-offset-y:<%=offsetY>;
    </script>
    <script type="text/javascript">
        var map, layer, lat, lon, geolocate, infowin,lonLat,geometryInfo,cartoCss,host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host;
        url = host + "/iserver/services/map-china400/rest/maps/China";
        function init() {
            if(!document.createElement('canvas').getContext) {
                alert('您的浏览器不支持 canvas，请升级');
                return;
            map = new SuperMap.Map("map", {controls: [
                new SuperMap.Control.ScaleLine(),
                new SuperMap.Control.Zoom(),
                new SuperMap.Control.MousePosition(),
                new SuperMap.Control.Navigation({
                    dragPanOptions: {
                        enableKinetic: true
            cartoCss=document.getElementById("textData").text;
            var valueMap={pointFile:"",offsetY:0};
            var cartoCssStr=replaceString(cartoCss,valueMap);
            layer = new SuperMap.Layer.TiledVectorLayer("China", url,{cacheEnabled:true},{useLocalStorage:true,cartoCss:cartoCssStr});
            layer.events.on({"layerInitialized": addLayer});
        function addLayer() {
            map.addLayers([layer]);
            var center = new SuperMap.LonLat(11793760,4407704);
            map.setCenter(center, 5);
        function replaceString(str,obj){
            for(var prop in obj){
                var regexp=new RegExp("<%="+prop+">","gi");
                str=str.replace(regexp,obj[prop]);
            return str;
        function selectPoint(imgName){
            var imgUrl="url(../examples/images/"+imgName+".png)";
            var valueMap={pointFile:imgUrl,offsetY:-8};
            var cartocssStr=replaceString(cartoCss,valueMap);
            layer.setCartoCSS(cartocssStr);
    </script>
<body onload="init()">
<div id="map"></div>
<div id="cartoContainer" style="background-color: #fff">
    <div id="text">选择点类型：</div>
    <img id="firstImg"src="../examples/images/marker_red.png">
    <img src="../examples/images/marker_black.png">
    <img src="../examples/images/marker_blue.png"> <br/>
    <input type="radio" class="btn" name="image" value="marker_red" onclick="selectPoint(this.value)"/>
    <input type="radio" class="btn" name="image" value="marker_black" onclick="selectPoint(this.value)" />
    <input id="lastInput" type="radio" class="btn" name="image" value="marker_blue" onclick="selectPoint(this.value)" />
Sunbelt Computer Software

PL/B Language Development and Support

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Sunbelt Computer Software

PL/B Language Development and Support

FilesExpand file tree

cartoCSS_point.html

Latest commit

History

cartoCSS_point.html

File metadata and controls
