Consider taking the Color Cycle Survey

Hot spots

Additional information can be displayed on the panorama using hot spots. The hotSpotDebug parameter exists to assist with locating where to place hot spots; when enabled, it prints the coordinates of mouse clicks to the browser’s developer console, which makes it much easier to figure out where to place hot spots.

<iframe>

<iframe width="600" height="400" allowfullscreen style="border-style:none;" src="https://cdn.pannellum.org/2.4/pannellum.htm?config=https://pannellum.org/configs/hot-spots.json"></iframe>

Standalone

https://cdn.pannellum.org/2.4/pannellum.htm#config=https://pannellum.org/configs/hot-spots.json

API

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hot spots</title>
    <link rel="stylesheet" href="https://cdn.pannellum.org/2.4/pannellum.css"/>
    <script type="text/javascript" src="https://cdn.pannellum.org/2.4/pannellum.js"></script>
    <style>
    #panorama {
        width: 600px;
        height: 400px;
    }
    </style>
</head>
<body>

<div id="panorama"></div>
<script>
pannellum.viewer('panorama', {
    "type": "equirectangular",
    "panorama": "/images/bma-1.jpg",
    /*
     * Uncomment the next line to print the coordinates of mouse clicks
     * to the browser's developer console, which makes it much easier
     * to figure out where to place hot spots. Always remove it when
     * finished, though.
     */
    //"hotSpotDebug": true,
    "hotSpots": [
        {
            "pitch": 14.1,
            "yaw": 1.5,
            "type": "info",
            "text": "Baltimore Museum of Art",
            "URL": "https://artbma.org/"
        },
        {
            "pitch": -9.4,
            "yaw": 222.6,
            "type": "info",
            "text": "Art Museum Drive"
        },
        {
            "pitch": -0.9,
            "yaw": 144.4,
            "type": "info",
            "text": "North Charles Street"
        }
    ]
});
</script>

</body>
</html>

Pannellum is developed on GitHub by Matthew Petroff.
CDN via KeyCDN.