Try creating and customizing a callout in a test tour.

Possibilities

• The presence of an interface. Visual control of all changes - you immediately see the result!
• Work in a regular Internet browser.
• Flexible customization of the overall callout design (width, color, transparency, shadow, borders, etc.)
• Created callouts are saved in the tour.xml file.
• Ability to save design presets for use in subsequent projects.
• A wide range of possibilities for editing the code of layers and styles is provided.

Example.
YouTube

---

Connection.

Place the folder with the "callout_transformer" plugin in the root folder of the tour.

Write basically xml:

<include url="callout_transformer/callout_tr.xml" />
<include url="callout_transformer/editor/edit_callout_tr.xml" />

When finished, disable the editor by deleting this line:

<include url="callout_transformer/editor/edit_callout_tr.xml" />

---

• 1 central point. The entire callout is dragged with the mouse.
• 1-2 callout lines. By grabbing point 2, you can rotate and stretch around point 1
• 2-3 callout lines. By grabbing point 3, you can rotate and stretch around point 2
• 4 is a block with text. By grabbing it, you can move it relative to point 3 if drag permission is enabled in the panel.

In edit mode, the red and green dots appear when the mouse is hovered over.

---

- Create a callout. The callout is created in the center of the screen.

- Open design editing panel.

- Copy the settings. Click on the callout to make it active, click on the copy button - its parameters are copied and the next callout will be created with the copied parameters.

- Enable/disable text block dragging.

- Output the code of the created callouts of the current scene to the browser console. You can copy and paste the code into the scene. To open the browser console, click "F12"

- Show/hide the sight. For the convenience of the location of the created callout.

- Delete the selected callout.

Signature entry line - Enter the text of the callout. You can also enter the text in the callout itself by clicking on it.

step angle - Disable/enable the fixation of the rotation angle of the extension lines. The angle of fixation can be changed in the file callout_tr.xml set_pit.angle_step="15"

Save tour.xml - The file is being createdtour.xml with the callout code written into it. Replace the existing one with the one you are creating.
Callouts are recorded inside the scenes at the very end after the comment
<!--*** callout_transformer ***-->
Do not prescribe anything of your own after it. The next time you save it, only the callout code is overwritten there.

---

The panel of the callout design editor.

The callout elements are krpano layers!
The panel of the callout design editor. It is advisable to familiarize yourself with the description of the parameters, because the parameters of these layers are configured in the panel.
To change the parameter in the editor panel, click on the corresponding circle and drag left/right. Or enter a numeric value for the parameter.

To edit, click on the element:

• 1 - changing the fill color, border, shadow, size, etc.
• 2 - both callout lines are configured simultaneously.
  height is the width of the line.
  fill - the line color editor panel opens
• 3 - the second line of the callout, you can set the color separately.
<
• 4 - a block with text. changing the fill color, border, shadow, size, etc. as well as setting text parameters.

---

XML Settings.

In the file callout_tr.xml default callout style settings, in "set_pit" you can change them.

pit_border - point border parameters.
pit_bgroundedge - corner rounding parameters.
pit_color - the fill color of the dot point.
pit_shadow - point shadow parameters.
pit_width is the width of the point.
pit_height is the height of the point.

Lines
l_color - the color of the lines.
l_thickness - line thickness.

Text block
t_bg - there is/is not a background.
t_bgcolor - fill color.
t_bgalpha - background transparency.
t_bgroundedge - rounding corners.
t_bgshadow - shadow parameters.
css - css text style.
t_padding - text margins.
t_txtshadow - text shadow parameters.
t_width - block height(pixel/auto).
t_height - block width(pixel/auto).

---

Life Hack. 😉

in the file example.xml there is a scene code in which there are several callout options with different designs.
Copy the scene code to your tour and use it as a template to create callouts.
Click on the callout, click the copy button in the panel, open the desired scene, create a callout with the copied settings.
You can create your own callout design in this scene and save it.
If you created your callouts in the test scene, copy it back to example.xml to use in other projects, and delete the scene from the current project.

---

Purchase "Callout transformer " plugin.

You can purchase the plugin by paying by the methods indicated below.
The archive for download will be sent within 24 hours after payment is received.
You will receive plug-in updates for free!
To purchase a plugin "Callout transformer" for 37 EUR.

Pay-Pal payment

Send your Pay-Pal address to novosibpano@yandex.ru and write the name of the plugin,
I will send you an invoice for payment via Pay-Pal.

If you have a PayPal account, send me the address, I will issue an invoice via PayPal.

---

---