Scribble Maps Blog
← All posts

Scribble Maps Blog

Naše dosud největší vydání, mobilní verze a API.

Jsme nesmírně nadšení (a tak trochu se nám ulevilo), že konečně vydáváme novou verzi Scribble Maps. Je toho hodně, o čem můžeme mluvit. Spustili jsme nový základní editor a také plnohodnotné API.

Od Flash k HTML5/Javascriptu

I když mnoho našich uživatelů nemusí technologickou změnu plně chápat, její důsledky jsou obrovské. Přechod z Flash na HTML5/Javascript nebyl zrovna jednoduchý, a to zejména proto, že jsme chtěli zachovat uživatelský zážitek co nejvíce podobný tomu, díky kterému byly původní Scribble Maps tak populární.

Chtěli jsme, aby byl zážitek z nové verze natolik konzistentní, že lidé ani nepoznají, že jsme v podstatě všechno postavili znovu od základů. I tak jednoduché věci, jako jsou vlastní kurzory, byly výzvou, protože jsme chtěli zachovat kompatibilitu napříč prohlížeči. Nová verze tak funguje i ve starém IE7.

Poté, co Google oznámil, že již nebude podporovat flashovou verzi svého Maps API, jsme se rozhodli pro několik klíčových věcí, které jsme chtěli udělat, když už musíme provést kompletní přestavbu.


  1. Chtěli jsme, aby webová aplikace fungovala jak na desktopu, tak v mobilním prostředí.
  2. Chtěli jsme vytvořit vlastní vykreslovací jádro, abychom v případě potřeby mohli přejít k jiným poskytovatelům API.
  3. Nechtěli jsme porušovat podmínky služby žádného poskytovatele mapového API.
  4. Chtěli jsme, aby přestavba byla zaměřena na API, aby vývojáři mohli využívat naše nástroje pro tvorbu map ve svých aplikacích.

Scribble Maps na mobilních zařízeních

Jedním z nejčastějších požadavků, které jsme dostávali, byla možnost používat Scribble Maps v mobilním prostředí, a to zejména na tabletech. Vzhledem k tomu, že jsme využili javascript, aplikace na tabletových zařízeních funguje.

Spustit mapovou aplikaci je však jedna věc a zajistit její použitelnost věc druhá. V desktopové verzi Scribble Maps máte například k dispozici najetí myší (roll over), což tablety nepodporují.
To nás vedlo k úpravě uživatelského prostředí na základě toho, zda používáte dotykové zařízení. K tomu dochází automaticky bez nutnosti upravovat jakýkoli kód.

Scribble Maps API

Existuje asi půl tuctu velmi populárních mapových API, takže jsme se chtěli zaměřit konkrétně na editaci a interaktivitu a ostatní vizualizace a vykreslování dlaždic nechat na jiných API. Když jsme se rozhodovali, jak chceme API strukturovat, usoudili jsme, že jedním z nejlepších stylů pro programování v Javascriptu je JQuery.  Je tedy možné vytvářet překryvy a interaktivitu na jediném řádku.

ScribbleMap.draw.line([[lat, lng], [lat2, lng2]], { lineColor: "#0000FF" }).click(function() { alert("I have been clicked") });


Kreslení ve Scribble Maps funguje stejně jako canvas, takže můžete předem specifikovat styl a nakreslit více čar, které tento styl převezmou. To platí nejen pro tvary, ale i pro věci jako značky (Markers). Je tedy možné dělat věci jako

Vztah, který má uživatel s mapou, je definován prostřednictvím nástrojů a změnou nástrojů měníte způsob, jakým uživatel s mapou komunikuje.


Dynamic Image API

Jednou z hlavních věcí, k nimž se Scribble Maps používají, je generování obrázků. To pro nás při odchodu od flash představovalo nejen obrovský problém, ale také novou příležitost. S jinými mapovými API existuje možnost vytvořit "statický obrázek". Problém s těmito API pro statické obrázky spočívá v tom, že téměř všechna mají omezení na množství dat, která mohou být na vykresleném obrázku.

Se Scribble Maps naopak žádné omezení neexistuje. Jakmile je mapa uložena, lze vyžádat její obrázek bez ohledu na to, kolik dat na ní je. Navíc při uložení mapy se platnost obrázku zruší a při příštím vyžádání se vykreslí znovu. To vám efektivně umožňuje vytvářet odkazy na obrázky, které se aktualizují podle toho, jak mapu měníte.
Níže je příklad jednoho takového obrázku.



Nový Widget

S verzí 2.0 jsme také představili widget, který má více ovládacích prvků uživatelského rozhraní. Toto je naše první verze a během následujících několika týdnů ji budeme vylepšovat.
 

Odkazy

Scribble Maps API
Skupina Scribble Maps API

← All posts