百度地图开发:Label文本居中

简介: 百度地图开发:Label文本居中

封装函数

//文本标签;
function addLabel(point, txt) {
    var opts = {
        position: point,
        offset: new BMap.Size(0, 20)//设置文本偏移量
    }
    var label = new BMap.Label(txt, opts); // 创建文本标注对象
    label.setStyle({
        color: "#FFF",
        fontSize: "10px",
        height: "24px",
        lineHeight: "20px",
        padding: "2px 5px",
        border: "1px solid rgba(230, 0, 0, 0.7)",
        background: "rgba(230, 0, 0, 0.7)",
        fontWeight: "bold",
        transform: 'translateX(-50%)',
        fontFamily: "微软雅黑"
    });
    map.addOverlay(label);
}


解决方案

offset: new BMap.Size(0, 20)//设置文本偏移量


 transform: 'translateX(-50%)',

Lockdatav Done!


相关文章
|
8月前
文本居中显示
文本居中显示
|
定位技术
百度地图标注maker图标按照分类显示不同的样式
百度地图标注maker图标按照分类显示不同的样式
126 0
|
Web App开发 前端开发 JavaScript
探索CSS单行文字居中,多行文字居左的实现方式
探索CSS单行文字居中,多行文字居左的实现方式
探索CSS单行文字居中,多行文字居左的实现方式
|
6月前
|
前端开发 容器
CSS【详解】对齐 (含文本垂直对齐,文本水平对齐、单行文本垂直居中、多行文本垂直居中、6 种方案块级元素水平垂直居中 、7 种方案图片水平垂直居中、文本自适应对齐、图标和文本对齐,图片和文本对齐等)
CSS【详解】对齐 (含文本垂直对齐,文本水平对齐、单行文本垂直居中、多行文本垂直居中、6 种方案块级元素水平垂直居中 、7 种方案图片水平垂直居中、文本自适应对齐、图标和文本对齐,图片和文本对齐等)
174 0
|
6月前
|
JavaScript
文本,最简单的文本样式设计风格样式,让Element-UI盒子居中的写法
文本,最简单的文本样式设计风格样式,让Element-UI盒子居中的写法
div盒子水平垂直居中以及表格的居中的方法
div盒子水平垂直居中以及表格的居中的方法
156 0
HTML中图片和文字按照上下排列并且水平居中显示
HTML中图片和文字按照上下排列并且水平居中显示
317 0
|
Web App开发 前端开发
去掉谷歌默认的input textarea边框样式
谷歌浏览器Chrome基于WebKit开源浏览器引擎,自然能够通过相关的一切方法自定义设置浏览器的默认状态。谷歌浏览器Chrome安装之后,大家应该都留意到所有的表单都会添加黄色边框特效。在某些时候这些特效还是很不错的,但是当网站本身就已经对于表单样式有一定的设计时,这种默认表单样式就会让人觉得套样了!
177 0
|
前端开发
CSS高级技巧——鼠标样式,轮廓,文本域防拖拽,vertical-align 垂直对齐,文字溢出问题
CSS高级技巧——鼠标样式,轮廓,文本域防拖拽,vertical-align 垂直对齐,文字溢出问题
244 0
CSS高级技巧——鼠标样式,轮廓,文本域防拖拽,vertical-align 垂直对齐,文字溢出问题
文字到底能玩出多少花样(二)background-clip实现hover文字填充效果
文字到底能玩出多少花样(二)background-clip实现hover文字填充效果
239 0
文字到底能玩出多少花样(二)background-clip实现hover文字填充效果

热门文章

最新文章