在上一篇中实现一个icon + label的Marker需要使用两个Tangram的Marker, 今天分析了Tangram的源码后, 发现Tangram时支持单一Marker同时显示的, 这需要使用嵌套的Style。

上一篇使用的Style是两个:

 style: points,
color: white,
size: [32px, 32px],
order: 100,
collide: false

text:
text_source: function(){ return "label"},
priority: 100

但其实points style支持text属性, 两个合并后变成:

style: points,
color: white,
size: [32px, 32px],
order: 100,
collide: false,
text:
text_source: 'function(){ return \"Title\"}',
priority: 100

代码如下

void MarkerImpl::createMarker(const std::string &iconURI, const std::string &title)
{
QImage img(QString(iconURI.c_str()));
int width = img.width();
int height = img.height();
auto argb = new unsigned int [width * height];
for(int h=height-; h>-; --h){
for(int w=; w<width; ++w){
int pix = img.pixelColor(w, h).rgba();
int pb = (pix >> ) & 0xff;
int pr = (pix << ) & 0x00ff0000;
int pix1 = (pix & 0xff00ff00) | pr | pb;
argb[w + h*width] = pix1;
}
}
m_map->markerSetBitmap(m_ID, width, height, argb);
delete[] argb; static const char* MARKER_STYLE_TEMPLATE =
"{ style: 'points',"
" color: 'white',"
" size: [%1px, %2px],"
" order: 100,"
" collide: false,"
" text: {"
" text_source: 'function(){ return \"%3\"}',"
" priority: 100 } }";
QString iconStyle = QString(MARKER_STYLE_TEMPLATE).arg(width).arg(height).arg(title.c_str());
m_map->markerSetStyling(m_ID, iconStyle.toStdString().c_str());
}

这里使用了单行YAML的写法, 详见http://baike.baidu.com/link?url=oZjxiBc2gjv6W4Kx3UpMIjzsBhmmY2MJ9VayYJx-1qAZZiN_R16J2H8mMXH0j2a-eYwjiOI5zkKcy1ehSF8WIK#2_2

在地图上添加POI(二)的更多相关文章

  1. 在地图上添加POI

    使用Tangram的Marker, 可以在地图上做各种标记, 效果图: Tangram是通过Marker在地图上添加标记的,Marker分Point, Polyline和Polygon三种, 分别对应 ...

  2. 【百度地图API】如何在地图上添加标注?——另有:坐标拾取工具+打车费用接口介绍

    原文:[百度地图API]如何在地图上添加标注?--另有:坐标拾取工具+打车费用接口介绍 摘要: 在这篇文章中,你将学会,如何利用百度地图API进行标注.如何使用API新增的打车费用接口. ------ ...

  3. 【百度地图API】建立全国银行位置查询系统(三)——如何在地图上添加银行标注

    原文:[百度地图API]建立全国银行位置查询系统(三)--如何在地图上添加银行标注 <摘要>你将在第三章中学会以下知识: 如何在地图上添加带银行logo的标注?(你也可以换成商场logo, ...

  4. GMap.Net开发之在地图上添加多边形

    上一篇介绍了在GMap上添加自定义标签(GMapMarker),这篇介绍在GMap上添加多边形(GMapPolyogn),并且介绍如何在地图上画任意的多边形. 如果已经知道了多边形的各个点的位置,就可 ...

  5. google maps js v3 api教程(2) -- 在地图上添加标记

    原文链接 google maps javascript官方文档:https://developers.google.com/maps/documentation/javascript/ 我们在创建地图 ...

  6. 微信小程序--地图上添加图片

    如何在微信小程序地图添加上,添加图片? 在微信小程序中,地图的层级最高,所以我们没有办法,通过定位,在地图上添加图片等信息; 处理办法: 添加控件:controls; 其中有个属性position,进 ...

  7. 利用WPF建立自己的3d gis软件(非axhost方式)(四)在地图上添加FrameworkElement

    原文:利用WPF建立自己的3d gis软件(非axhost方式)(四)在地图上添加FrameworkElement 先下载SDK:https://pan.baidu.com/s/1M9kBS6ouUw ...

  8. Google Map API v2 (三)----- 地图上添加标记(Marker),标记info窗口,即指定经纬度获取地址字符串

    接上篇 http://www.cnblogs.com/inkheart0124/p/3536322.html 1,在地图上打个标记 private MarkerOptions mMarkOption; ...

  9. ArcGIS 在地图上添加标注

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. C#读取带命名空间的xml,xaml文件的解决方案

    使用C#读取xml文件有三种常用的方式: 1.xmlDocument 2.XmlTextReader 3.Linq To Xml 但是这些方式在读写有些带命名空间的xml时就不知道怎么办了(例如把xa ...

  2. 旧版Xcode下载地址

    怕忘记了,做个记号 https://developer.apple.com/downloads/

  3. 安装Cocoa 新的依赖管理工具Carthage

    Cocoa的依赖管理器,我们已经有了CocoaPods,非常好用,那么为什么还要创建这样一个项目呢?本文翻译自Carthage的Github的README.md,带大家来了解一下这个工具有何不同之处. ...

  4. ubuntu导出文件

    ye@aliyun:python$ ./deploy.sh backup static-rw-r--r-- 1 ye ye 174K 2014-03-22 10:36 ./backup/fbz_sta ...

  5. warning: no newline at end of file

    编译错误:warning: no newline at end of file原因:程序结尾需要有一个空行解决办法:在程序末尾多打个回车就行了

  6. 2015年9月29日 sql 触发器

    触发器(trigger):当有关联操作的时候使用(级联操作),属于ddl关键字. eg:下订单时,创建中的商品数量要减少:退票时,总的票数要增加.         在订单上建立触发器         ...

  7. Computer Vision Applied to Super Resolution

    Capel, David, and Andrew Zisserman. "Computer vision applied to super resolution." Signal ...

  8. NWERC 2012 Problem A Admiral

    一个最小费用最大流的简单建模题: 比赛的时候和小珺合力想到了这个题目的模型: 方法:拆点+边的容量为1 这样就可以保证他们不会在点上和边上相遇了! 感谢刘汝佳大神的模板,让我这个网络流的小白A了这个题 ...

  9. hdu 2894

    刚刚看到这个题感觉挺复杂的~~~因为它还要输出字典序: 很容易知道对于任意的k,第一个输出总是1<<k; 而对于第二个嘛,不管怎么样,前k个元素总是k个0: 然后取前k-1个数,加上0或者 ...

  10. const char*, char const*, char*const的区别

    http://www.cnblogs.com/aduck/articles/2244884.html