Jeffrey Cross
Jeffrey Cross

Kódové pole: Pobavte se pomocí služby Google Autocomplete

Automatické doplňování je jednou z mnoha zajímavých funkcí společnosti Google. Pokud například začnete do vyhledávacího pole zadávat text „Jak to udělám“, společnost Google předloží seznam top-10, který by podle vás mohl být vyhledáván. Tato kolektivní „moudrost davů“, generovaná analýzou milionů podobných hledání, může být veselá, tragická nebo hluboce svědčící o stavu člověka. Často jsou to všechny tyto najednou.

Tato skica vám umožní prozkoumat zeitgeist služby Google, kterou vyberete. Funguje to takto. Když zadáte frázi jako „Jak to udělám“, skica vytvoří 26 variant přidáním každého písmene abecedy na konci: „jak to udělám,“ „jak udělám b,“ „jak udělám c, a tak dále. Poté společnost Google dotazuje každou variantu a přidá deset výsledků do běžícího seznamu. Díky 260. výsledkům, které se hodí k vlastnímu dramatu vidět naděje, sny a touhy miliónů, je 260 výsledků prezentováno jako ikonický svitek „hvězdných válek“:

Rozhraní API automatického doplňování

Automatické doplňování je založeno na relativně jednoduché adrese URL, která vypadá takto.

http://google.com/complete/search?output=toolbar&q=kódovaný vyhledávaný výraz

Na rozdíl od většiny stránek, které navštěvujete, které představují pěkné HTML, toto vrací data XML, která jsou určena pro čtení počítačů. Tato neuvěřitelně výkonná technika, známá jako API (Application Programming Interface), umožňuje programům snadno komunikovat přes síť. Bez rozhraní API bychom museli jít do společnosti Google, zadat 26 krát frázi a poté ručně shromáždit všechny výsledky. API nám to umožňuje automaticky.

Chcete-li získat podkladová data XML pro návrhy „Jak na to“, stačí navštívit tuto adresu URL:

http://google.com/complete/search?output=toolbar&q=how+do+i+make

Pokud ve svém webovém prohlížeči zobrazíte možnost „Zobrazit zdroj“, zobrazí se některé XML, které vypadá podobně (i když jsem tento příklad formátoval tak, aby byly lépe čitelné):

...

Použijeme Zpracování XMLElement () knihovnu pro čtení tohoto XML data pro vytvoření rolovacího textu.

Nastavte náčrt

Nejdříve si však nechte skicu spustit. Protože používáme knihovnu controlP5 k získání fráze dotazu, budete muset tuto knihovnu nainstalovat a nakonfigurovat. (Pokud tomu tak není, sekce controlP5 v programu Codebox: Vytvoření fraktálového zvěřince vám sdělí, jak jej nastavit.) Zdrojový kód skici můžete chytit ze pole níže nebo ze souboru zetigeist.pde.

Jakmile se zdrojový kód dostane do Zpracování, spusťte náčrt a zadejte frázi. Po několika vteřinách byste měli vidět výsledky, které se začnou posouvat přes obrazovku a hrát Star Wars. (Pokud nezadáte žádný text, skica jednoduše zobrazí nejoblíbenější výsledky pro všechny obecné dotazy.)

Diskuse

Jak to funguje? Existuje několik klíčových prvků:

  1. Uchopí dávku dat z rozhraní API automatického doplňování
  2. Analyzuje XML XMLElement () a uložte výsledky
  3. Zobrazí výsledky jako rolovací seznam

Promluvme si o tom, jak chytit data z API. Zpracování loadStrings () funkce vám umožní chytit text libovolné URL, takže vše, co musíme udělat, je prezentovat rozhraní Autocomplete API s řádně formátovaným dotazem. K tomu použijeme jazyk Java URLEncoder Knihovna (nezapomeňte, že vše, co můžete v Javě použít, je férová hra pro Zpracování) zakódovat() funkce, která kóduje text zadaný do userQuery box.

getSuggestions () funkce používá naše zakódovat() funkce pro načtení stránky a analýzu výsledků XML. Funkce používá XMLElement () objekt pro práci s výsledky. Stejně jako většina knihoven XML i tento používá syntaxi „rodokmen“, která umožňuje přístup k různým datovým prvkům. Jak je znázorněno na následujícím obrázku, data návrhu jsou prvním podřízeným prvkem () pod dětmi kořenového elementu ().

Protože skutečný text je nápověda v atributu, používáme getStringAttribute () funkce vytáhnout data, která chceme.

[Poznámka: že tato syntaxe je jiná než oficiální dokumentace, ale tento příspěvek na fóru komunity Zpracovatelů, problém XMLElement: funkce getInt / getString 'neexistuje' poskytuje podrobnosti.] Jakmile jsme sebrali text návrhu, připojím ho k suggestionList ArrayList.

Konečně stojí za to vysvětlit trochu o tom, jak to vlastně nazýváme getSuggestions () funkce. Jak uvidíte, je to vlastně nazýváno kreslit() metoda, která je trochu neobvyklá. Zpočátku jsem se snažil zchátrat všech 26 variant dotazu najednou vytvořením série rychlých zásahů proti Autocomplete. Rychle jsem narazil na API limit, což je maximální počet krát za sekundu, který můžete v daném čase použít. Na začátku náčrtu navíc byla dlouhá pauza, kterou jsem neměl rád.

Takže místo toho jsem přidal časovač nazvaný timeBetches tak, aby API bylo voláno pouze každých 5 sekund. Vzhledem k tomu, že se text posouvá poměrně pomalu, výsledkem bylo, že výsledky se časem vyrovnaly, což vedlo k hladšímu celkovému vzhledu bez porušení požadavků společnosti Google. Pokaždé, když narazíme na rozhraní API, postupujeme proti počítadlu, které nám říká, které písmeno abecedy přidat do základního dotazu. Jakmile dostaneme výsledky, resetujeme časovač. Tam je také trochu logiky, aby test, zda uživatel zadal nový dotaz termín a stiskl findButton.

Druhý kousek kreslit() zpracovává rolovací text. K tomu použijeme proměnnou nazvanou y držet souřadnici y prvního řetězce v suggestionList. Pak procházíme každým prvkem v seznamu a zapisujeme text na obrazovce s odkazem na proměnnou y, který je snížen na každém průchodu kreslit(). To nám dává pěkný, rolovací efekt. (Text je také vycentrován na osu x, což je provedeno jednoduchým vzorcem.)

Účinek Star Wars se dá snadno dosáhnout pomocí vestavěné 3D grafické knihovny Processing, která otáčí rovinu osy X o několik stupňů. Byl to úhledný hack, který jsem viděl na náčrtu Luise Gonzaleza „Star Wars“ na openprocesing.org. Velmi doporučuji tuto stránku jako zdroj inspirace a nápadů.

Více: Podívejte se na všechny sloupce Andrew's Codebox.

V hale Maker:


Začínáme se zpracováním Naučte se programování počítače jednoduchým způsobem pomocí zpracování, což je jednoduchý jazyk, který umožňuje používat kód pro vytváření výkresů, animací a interaktivní grafiky. Kurzy programování obvykle začínají teorií, ale tato kniha vám umožňuje skočit přímo do kreativních a zábavných projektů. Je ideální pro každého, kdo se chce naučit základní programování a slouží jako jednoduchý úvod do grafiky pro lidi s některými programovacími dovednostmi.

Podíl

Zanechat Komentář