HTML5 polygonal hotspots editor?

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

panomaster

Intermediate

Posts: 296

Location: Kobyłka, Poland

Occupation: Virtual Tours - Spherical Panoramas - Krpano developer

Thursday, July 13th 2017, 2:31am

HTML5 polygonal hotspots editor?

I do many projects that require making polygonal hotspots. Flash editor is... a little bit annoying. So I wrote my own HTML5 polygonal editor (I've had only 20 minutes to do it). It's not perfect but some ideas can be helpful to other KRPano developers.

How it works? Press space (keyboard) to start drawing, then click (mouse) anywhere to set point. Finally, press ESC to stop drawing polygon. Feel free to use it and develop it. But remember - it's just ideas - not plugin. However... crowdfunding would be great idea to develop such plugins...

http://www.ai360.pl/projekty/polygonal_editor/

Leszek Cuper
Panoramy 360
Wirtualne spacery

This post has been edited 4 times, last edit by "panomaster" (Jul 13th 2017, 3:01am)

Go to the top of the page

reza_shnia

Intermediate

Posts: 169

Occupation: krpano freelancer || creating ideas & coding them || krpano developer

Thursday, July 13th 2017, 7:15am

Excellent

My Plugins :

Go to the top of the page

Umalo

Professional

Posts: 1,051

Location: Osijek, Croatia, EU

Thursday, October 19th 2017, 7:40pm

Hey this looks cool. Although I don't use poligonal hotspots nice to know this code exist on the forum.
I could propose to open textield on the screen when ESC pressed and display hs code from memory for easy copy paste into the code.
Good job. *thumbup*

Edit: And that was my 1000 post. Goes to you...

Go to the top of the page

San7

Professional

Posts: 623

Occupation: coding in krpano

Monday, October 23rd 2017, 6:51am

great example! *thumbsup*

added saving to file save_polygon.xml.

"Space" - to start to draw again "space" - to end the previous and start the next, "Esc" to finish drawing, "s" to save
file save_polygon.xml.

San7 has attached the following file:

polygon hotspot.rar (307.71 kB - 439 times downloaded - latest: Sep 27th 2023, 8:04am)

https://novosibpano.ru/Plugins/

This post has been edited 2 times, last edit by "San7" (Oct 23rd 2017, 12:04pm)

Go to the top of the page

Konstantine

Beginner

Posts: 36

Monday, October 23rd 2017, 7:20am

Quoted from "San7"

great example!

added saving to file save_polygon.xml.

"Space" - to start to draw again "space" - to end the previous and start the next, "Esc" to finish drawing, "s" to save
file save_polygon.xml.