PhotoSphereViewer 全景图

1网站地址:http://photo-sphere-viewer.js.org/markers.html#demo

2参数中文地址:https://www.cnblogs.com/big-tree/p/5933437.html

使用方法:

/**
 * Initialize the viewer
 */
var PSV = new PhotoSphereViewer({ // main configuration panorama: rootURL + '/assets/Bryce-Canyon-National-Park-Mark-Doliner.jpg', container: 'photosphere', loading_img: rootURL + '/assets/photosphere-logo.gif', time_anim: false, caption: 'Bryce Canyon National Park © Mark Doliner', default_fov: 70, default_lat: 0.3, mousewheel: false, size: { height: 500 }, // list of markers markers: [ { // image marker that opens the panel when clicked id: 'image', longitude: 5.69810, latitude: -0.13770, image: rootURL + '/assets/pin-blue.png', width: 32, height: 32, anchor: 'bottom center', tooltip: 'A image marker. Click me!', content: document.getElementById('lorem-content').innerHTML }, { // html marker with custom style id: 'text', longitude: 0, latitude: 0, html: 'HTML marker ♥', anchor: 'bottom right', style: { maxWidth: '100px', color: 'white', fontSize: '20px', fontFamily: 'Helvetica, sans-serif', textAlign: 'center' }, tooltip: { content: 'An HTML marker', position: 'right' } }, { // polygon marker id: 'polygon', polygon_px: [3184, 794, 3268, 841, 3367, 1194, 3327, 1307, 3065, 1221, 3097, 847], svgStyle: { fill: 'rgba(200, 0, 0, 0.2)', stroke: 'rgba(200, 0, 50, 0.8)', 'stroke-width': '2px' }, tooltip: { content: 'A dynamic polygon marker', position: 'right bottom' } }, { // circle marker id: 'circle', circle: 20, x: 2500, y: 1000, tooltip: 'A circle marker' } ] }); /** * Create a new marker when the user clicks somewhere */ PSV.on(

转载于:https://www.cnblogs.com/lst619247/p/8065029.html

你可能感兴趣的:(PhotoSphereViewer 全景图)