arcgis for js 3在地图上给文子图层添加背景色



 addBackgroundTextSymbol('0', number.format(Number(result.areas[0]) * 1.145 * 1.145, {
                                        pattern: '#.000'
                                    }) + "平方公里", spoint, 0, 0, 0, -3);

/* type  类型
   infoTem 文字 
   point 点位
    x, y, x1, y1 偏移的数值
 **/
 function addBackgroundTextSymbol(type, infoTem, point, x, y, x1, y1) {
                    var _fontsize = 10;
                    var _radius = 6;
                    var _infoTem = infoTem;
                    var point = point;
                    var bglineSymbol = new SimpleLineSymbol("solid", new Color("gray"), 1);
                    var width = (chkstrlen(_infoTem)) * 0.5 * (_fontsize + 3) + 4; //
                    var height = _fontsize * 1.8;
                    var radius = _radius;
                    //设置背景框的大小
                    var path = "M0" + " " + radius + "L0" + " " + (height - radius) + "Q0" + " " + height + " " + radius + " " + height + "L" + (width - radius) + " " + height + "Q" + width + " " + height + " " + width + " " + (height - radius) + "L" + width + " " + radius + "Q" + width + " " + "0" + " " + (width - radius) + " " + "0L" + radius + " " + "0Q0" + " " + "0" + " " + "0" + " " + radius;
                    var bgSymbol = new SimpleMarkerSymbol();
                    bgSymbol.setPath(path);
                    bgSymbol.setColor(new Color("gray"));
                    bgSymbol.setOutline(bglineSymbol);
                    var size = Math.max(height, width);
                    bgSymbol.setSize(size);
                    var bgGraphic = new Graphic(point, bgSymbol);
                    bgSymbol.xoffset = x;
                    bgSymbol.yoffset = y;
                    if (type != "1") {
                        gismap.graphics.add(bgGraphic);
                    } else {
                        BgCGraphic = gismap.graphics.add(bgGraphic);
                    }
                    var sfs = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
                        new SimpleLineSymbol(SimpleLineSymbol.STYLE_SHORTDASHDOT),
                        new Color([0, 0, 255, 0.5]));
                    var font = new Font(_fontsize + "px", Font.STYLE_NORMAL, Font.VARIANT_NORMAL, Font.WEIGHT_LIGHTER);
                    var ts = new TextSymbol(_infoTem, font, new Color([255, 255, 255]));
                    ts.setAlign(Font.ALIGN_START);
                    ts.xoffset = x1;
                    ts.yoffset = y1;
                    var textGraphic = new Graphic(point, ts, sfs);
                    if (type != "1") {
                        gismap.graphics.add(textGraphic);
                    } else {
                        totalGraphic = gismap.graphics.add(textGraphic);
                    }
                }
function chkstrlen(str) {
                    var strlen = 0;
                    for (var i = 0; i < str.length; i++) {
                        if (str.charCodeAt(i) > 255) //如果是汉字,则字符串长度加2
                            strlen += 2;
                        else
                            strlen++;
                    }
                    return strlen;

                }
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值