Mapka zmieniająca kolory w czasie rzeczywistym

0

Witam, zamierzam zrobić rzut mapy globu na stronę z granicami państw. Strona zlicza osoby które przychodzą na stronę i są np. z Polski, Niemiec, Kanady no i ustala sobie na bieżąco liczbę osób z danego kraju, a wtedy w zależności od tego, zmienia się siła koloru danego kraju, np. Polska będzie na czerwono i z każdą nową osobą, będzie kolor robił się coraz bardziej ostry. Chodzi mi o to, czy da radę zrobić tak, aby była mapa globu rzucona na stronę (z granicami) i na podstawie danych, zmieniał skrypt sobie kolor? Chodzi mi o to, bo przecież kraje mają "zawiłe" granice, wybaczcie za słowa, ale nie wiem jak to ubrać sensownie w całość, mam zarys w głowie i ciężko mi to sensownie na słowa przelać. No i jak kraje mają granice takie zawijasy, to czy da się to w takim razie zrobić? Aby tylko dany obszar zalać kolorem? Mapka ma być taka user image, wiadomo, że małych wysepek nie będę uwzględniać w ogóle, tylko chodzi mi o zwykle kraje, albo chociaż nawet o kontynenty.

0

canvas, svg, flash - wybierz sobie technikę ;) ew. mnóstwo przeźroczystych png i mnóstwo pozycjonowania absolutnego, ale to bardzo niefajna metoda

0

@MarekR22, czemu usunąłeś post, był dobrą przecież odpowiedzią :(

Masz przykład: http://dl.dropboxusercontent.com/u/5728198/WorldMap/world.htm, tu jest chyba nawet do pobrania: http://www.codeproject.com/Articles/262179/SVG-World-Map - zresztą takich mapek jest cała masa...

BTW: @dzek69, jak jest w tej chwili z obsługą svg w przeglądarkach?

0
dzek69 napisał(a):

no właśnie przez chwilę przeszła mnie myśl, z pozycjonowaniem każdego państwa na mapie i tak sobie myślę, no takich jaj to chyba nie będzie... Dziękuję bardzo za odpowiedź, już sprawdzam canvas, bo nad flashem się zastanawiałem, ale będę musiał się w to wgłębić, tak jak i w canvas, bo wydaje się to złożone :)

madmike napisał(a):

Dzięki za odpowiedź :) Tzn. wiesz, nie chcę korzystać z całego kodu (gotowca), co najwyżej będę się wzorować :)

1

Ja bym skusił się na SVG, bo jest najprostsze w implementacji (ot parę kolejnych tagów w dokumencie, które można css-ami stylować), zadziała bez javascriptu, najłatwiej znajdziesz jakiś konwerter kształtu do SVG, itd. Już nie mówiąc o skorzystaniu z gotowej mapki świata (chyba sam rysować nie chcesz)

0
dzek69 napisał(a):

Dzięki bardzo a pomoc! Zaraz skończę i będę zaznajmiać się z tematem mapki :)

0

Rozglądam się po necie i w sumie już coś z tego czaję, ale mam plik .svg z mapą świata i są dane np. jednego elementu, jakim cudem one są ściągane? Bo jak mam wiele elementów na mapce, tzn. krajów, to każdy z nich muszę ściągnąć i np. zapisać według kodu ISO, aby później zmieniać kolor danych elementów. A chodzi mi o to, czy za pomocą programu jakiegoś, mogę ściągnąć dane jednego elementu? Chodzi mi o to

<path class="kiwi" d="M210.333,65.331C104.367,66.105-12.349,150.637,1.056,276.449c4.303,40.393,18.533,63.704,52.171,79.03
  c36.307,16.544,57.022,54.556,50.406,112.954c-9.935,4.88-17.405,11.031-19.132,20.015c7.531-0.17,14.943-0.312,22.59,4.341
  c20.333,12.375,31.296,27.363,42.979,51.72c1.714,3.572,8.192,2.849,8.312-3.078c0.17-8.467-1.856-17.454-5.226-26.933"
0

wytłumacz to sensowniej. jakim programem jakie dane chcesz "ściągać" i po co?

0

Chodzi o to, że każde państwo będzie mieć swoje współrzędne na pliku SVG, no i jak takie dane, tzn. wytyczony obszar na pliku SVG mogę pobrać? Bo szukam np. poprzez "how to take a path of the elements in svg" czy jakoś i dupa, nic znaleźć nie mogę :|

0

ale gdzie/jak "pobrać"? chodzi Ci o wybranie elementu w CSS/JS? po prostu nadaj mu atrybut id czy tam class (co już masz widzę).

0

Kurde haha chyba się nie rozumiemy :D Chodzi o to, że przecież muszę jakby "wyrwać" z mapy, np. to gdzie na pliku SVG leży Polska, aby później zalać ją kolorem w zależności od liczby użytkowników z danego kraju. No i jak ja mogę wyrwać ten kawałek? Bo przecież takich kawałków będę mieć tyle, ile jest państw, a jak mam taką jedną mapę wielką to z niej te kawałki pobieram - ich współrzędne - jak pobranie tych współrzędnych zrobić? Dlatego podałem tamten przykładu kodu, skąd to pobrać :)

0

nie rozumiem.

http://jsbin.com/oXuseRoR/2/edit/

co w tym jest źle, żebyś chciał coś wyrywać z mapy?

  1. możesz pokolorować elementy po stronie serwera nadając klasę (albo wstawić styl inline)
  2. możesz pokolorować elementy przez css
  3. możesz pokolorować elementy przez js
0

Nie no, z kolorowaniem to dam sobie radę :) tylko chodzi mi o to, że jak masz mapę http://upload.wikimedia.org/wikipedia/commons/1/1c/BlankMap-World8.svg zgrywam ją sobie i chcę wyrwać z niej np. Polskę w postaci tego kodu, aby móc ją później pokolorować, to chodzi mi o to, jak to zrobić? Tzn. jak wyrwać Polskę z mapy, a raczej współrzędne jakie obejmuje ten kraj?

0

haha dobra, już mam, dopiero teraz zobaczyłem, że ja operowałem na PNG, a nie na SVG dlatego kodu nie wyświetlało mi ahhahahahahaa wybacz za cały ten problem...

0

..., zakładam, że temat rozwiązany?

0

Tak, wielkie dzięki za pomoc! :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1