This sample demonstrates the custom popup control. The popup dynamically loads the content through a delegate and also takes care of multiline spans which are out of the box not handled well by SVG.

   function MakeTipShape() {
        tip = new TypeViz.SVG.Group();
        canvas.Append(tip);
        var tipShape = new TypeViz.SVG.Path();
        tipShape.Data = "m-99.25,21.75l79.75,0l20,-20.75l20,20l80.25,0l-0.25,100.5l-199.75,0l0,-99.75z";
        tipShape.Background = "SteelBlue";
        tip.Append(tipShape);
        tipContainer = new SVG.Group();
        tipContainer.Position = new Point(0, 50);
        tip.Append(tipContainer);
    }
    function getPopupContent(item) {
        tipContainer.Clear();
        if (TypeViz.IsDefined(item)) {
            var tb = new SVG.TextBlock();
            tb.Text = item.Background;
            tb.Background = "White";
            tipContainer.Append(tb);
        }
        return tip;
    }
    function document_load() {
        var div = document.getElementById("canvas");
        if (div) {
            var options = new SVG.CanvasOptions();
            options.Width = 1000;
            options.Height = 1000;
            canvas = new SVG.Canvas(div, options);
            MakeTipShape();
            var popup = new TypeViz.Controls.Popup(getPopupContent);
            for (var i = 0; i < 20; i++) {
                var circle = new TypeViz.SVG.Circle(new TypeViz.Point(120 + i * 40, 120), 20);
                circle.Background = TypeViz.Media.Colors.Random;
                canvas.Append(circle);
                popup.AddAnchor(circle);
            }
        }
        else
            alert('No DIV found.');
    }