Hi,
Adding text to shapes is possible with HTML elements. We can attach the labels to the map "scrollElement" which is automatically scrolled with the map layers.
shapeCreated: function(e) {
// Create the label
var label = $("<span class='label'></div>")
.html(e.shape.dataItem.properties.abbrev)
.appendTo(e.sender.scrollElement);
// Position the label
...
}
-- Live demo --
Positioning is a bit trickier, as we need to have the bounding box of the shape. We'll add a public method for this saving you a good part of the demo code.
We intend to make this much easier, possibly with built-in templates for the shapes.
I hope this helps.
Regards,
T. Tsonev
Telerik
DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.