Klikanie na obiekt umieszczony w canvas |
Klikanie na obiekt umieszczony w canvas |
12.02.2020, 14:31:12
Post
#1
|
|
Grupa: Zarejestrowani Postów: 5 Pomógł: 0 Dołączył: 6.02.2020 Ostrzeżenie: (0%) |
Panie i panowie, siedzę nad tym, przeszukuję internet i nie wiem jaksobie z problemem poradzić. Zainteresowałem się canvasem (w połączeniu z js/jquery) potrafi zrobić ciekawe efekty. Lecz nie mogę sobie poradzic z klikaniem - jest wiele tutoriali, które pokazują klikanie na prostokąt lub koło - co jest akurat proste do zrobienia ale jeśli kształt jest bardziej skomplikowany albo jest umieszczony png.
Jedyne co mi przychodzi do głowy to coś takiego - napisałem prostą funkcję, która analizuje każdy piksel z osobna oddaj mi współrzędne pierwszego "niebiałego" pixela od lewej i pierwszego "niebiałego" od prawej - wtedy mógłbym napisać statement że jeśli kursor jest na osi x pomiędzy y-start - y-stop to wtedy ... i wtedy przekopiować współrzędne - lecz jak będzie tych obiektów dużo, różnych, o różnym kształcie to wydaje mi się, że to nie jest optymalne rozwiązanie, a wręcz jestem przekonany, że musi być na to inny sposób. Pomóżcie proszę. |
|
|
12.02.2020, 14:43:00
Post
#2
|
|
Grupa: Zarejestrowani Postów: 6 765 Pomógł: 1823 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
Na wklęsłych obiektach metoda nie zadziała, już widać to na podbródku.
Jeśli jest tylko jeden obiekt, możesz sprawdzić po prostu kolor klikniętego piksela (zakładając, że obiekt nie posiada białych). Jeśli więcej, to najłatwiej trzymać współrzędnego obiektów jako bounding rectangle, czyli po prostu prostokąta obejmującego najbardziej wystające "wierzchołki" każdej krawędzi. Może łatwiej byłoby Ci z SVG. Ten post edytował trueblue 12.02.2020, 14:43:11 -------------------- |
|
|
12.02.2020, 15:22:22
Post
#3
|
|
Grupa: Zarejestrowani Postów: 5 Pomógł: 0 Dołączył: 6.02.2020 Ostrzeżenie: (0%) |
kiedy powinno się użyć svg a kiedy canvasa?
|
|
|
12.02.2020, 15:43:51
Post
#4
|
|
Grupa: Zarejestrowani Postów: 6 765 Pomógł: 1823 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
Canvas do obsługi bitmap (duże bitmapy, filtry, operacje bitowe), SVG do wektorów.
Gdybyś chciał znajdywać kontur, to należałoby posłużyć się metodą marching ants. Jeśli zastosujesz bounding rectangle, to w przypadku kilku obiektów zaczynasz od tego na najwyższej warstwie (kolejność musisz przechowywać w jakiejś tablicy). Co chcesz osiągnąć? -------------------- |
|
|
12.02.2020, 15:50:39
Post
#5
|
|
Grupa: Zarejestrowani Postów: 5 Pomógł: 0 Dołączył: 6.02.2020 Ostrzeżenie: (0%) |
Mam mapę świata i na niej są poumieszczane przeróżne obiekty i muszą być "klikalne"
to w takim razie zapoznam się z svg. Może to będzie lepsze rozwiązanie. Jest taka gra karciana TUTAJ i w przeglądarce wyświetlana jako canvas więc raczej w canvasie zrobiona? No i sobie jakoś bez trudu poradzili z klikaniem na obiekty. Ten post edytował belg2020 12.02.2020, 15:54:30 |
|
|
12.02.2020, 16:19:08
Post
#6
|
|
Grupa: Zarejestrowani Postów: 6 765 Pomógł: 1823 Dołączył: 11.03.2014 Ostrzeżenie: (0%) |
Nie logowałem się tam, więc nie wiem.
Być może jest to połączenie canvas i SVG, albo canvas na canvas. Jeszcze jest coś takiego jak tag <area> i <map>. http://mattstow.com/experiment/responsive-...ps.html#bubbles Ten post edytował trueblue 12.02.2020, 16:21:43 -------------------- |
|
|
12.02.2020, 16:42:01
Post
#7
|
|
Grupa: Zarejestrowani Postów: 5 Pomógł: 0 Dołączył: 6.02.2020 Ostrzeżenie: (0%) |
O TO do mojego projektu w zupełności wystarczy! dziękuje serdecznie.
|
|
|
Wersja Lo-Fi | Aktualny czas: 1.06.2024 - 05:56 |