Adding text to a marker icon

[Guillaume227]

I have a marker displaying an icon: in code I set styling to : (my scene.yaml defines 'my_icons' style) "{ style: 'my_icons', sprite: 'booth', color: '#ff48ed73', collide: false, interactive: true}"

That's working nicely. Now I would like to add a text label to that same marker. Is that possible, or do I have to add another marker with style 'text' (as mentioned in #1094 for example)? I have tried several approaches without luck: 1) I tried changing styling to: "{ style: 'my_icons', sprite: 'booth', color: '#ff48ed73', collide: false, interactive: true, text_source: 'foo', text: {text_source: 'bar', visible: true, font: { size: 64px, fill: 'black' }}}" (note that I tried setting text_source in two places, inspired by what I saw in s_StyleParamMap in styleParam.cpp - I gather that not all items from that style map apply simultaneously? is there a reference anywhere of which ones can be used in combination?)

2) I tried updating style definition in scene.yaml to

styles:
    my_icons:
        base: points
        texture: my_pois
        interactive: true
        text_source: 'foo'
        text:
            family: sans-serif
            weight: 400
            style: normal
            size: 64px
            fill: black

As a side question, can polygon features take a text label as well? Is there somewhere a list of properties supported by tangram-es, as opposed to general tangram?

I.e. I have tried using blend: inlay in the property map passed to addFeature but I get a StyleParam not found in the logcat. I see blend as a style parameters in the tangram doc (https://mapzen.com/documentation/tangram/styles/) but I understand trangram-es is a subset of tangram.

[matteblair]

Hi Guillaume,

tangram-es supports almost all of the parameters in the online documentation that you linked to, any parameters that aren't supported in -es are noted on in the documentation.

There is, however, a limitation for Markers that prevents drawing with more than one Style for a single Marker. Drawing Text along with an icon technically constitutes a second Style for the marker, so at the moment you can have either an icon or text, but not both :\ This is probably pretty confusing, so I apologize for that.

Your best bet for now is probably to create another Marker for the text label.

[Guillaume227]

Thank you Matt for your answer, I will make do with another marker for the label.

Regarding display of labels inside a polygon (not a marker, defined as a map feature with a datasource), I am not quite there yet. From the doc, I read "When used with polygons, the label will be drawn at the polygon’s centroid. " With the styling below I expect one label to be displayed at the centroid of my polygon but I don't see anything show up. I made sure I am adding all the polygons with a "label" field in the property map.

` geofence:
    data: { source: geofence }
    poly:
        filter: { type: poly }
        draw:
          polygons:
            color: function () { return feature.color || 'pink'; }
            order: function () { return feature.order || 10000; }              
            text:
              text_source: function () { return feature.label || ''; }
              align: center
              anchor: center
              visible: true
              font:
                  family: sans-serif
                  weight: 400
                  style: normal
                  fill: green
                  size: 64px
                  stroke: { color: blue, width: 2 }

[tallytalwar]

1. There is a bug in the current code for text drawing for polygon geometry data. It is currently not drawing at the centroid, but at every vertex of the polygon. I have filed a PR for this: https://github.com/tangrams/tangram-es/pull/1277. Also centroid: true is not a valid draw rules now. Previously it used to be applied to point based styles, but the functionality has been replaced by the placement parameter.

2. That being said, you should have seen labels being drawn at every vertex of the polygon geometry data, which is what I see in my testing. (I think in your original comment, pre-edited, you did mention label is showing at every vertex of the polygon data). But now you do not see any label, can you confirm this?

Thank you Matt for your answer, I will make do with another marker for the label.

I have made some progress on displaying a label inside a polygon, however I am not quite there yet. With the styling below I expect one label to be displayed at the centroid of my polygon (thanks to centroid: true) but instead I see the label repeated at every vertex of the polygon:

[Guillaume227]

I did indeed edit my initial post when I realized centroid: true didn't feature in the tangram doc anymore. In that first attempt I could see the label repeated at every vertex as you say. Thanks for the PR.

[Guillaume227]

I can confirm that with the latest commit and using placement: centroid my text in polygon problem went away.

[eduardAndrei99]

"{color: 'green', style: 'greenMarker', size: [20px, 20px], order: 2000, collide: false, text_source: "function() { return 'test'; }"}"; and in scene.yaml: greenMarker: base: points texture: greenMarker draw: text: collide: true optional: true priority: 2 font: size: 14px family: NotoSans weight: bold stroke: {color: black, width: 1} it works