Skrypt chmury słów w HTML5 | DailyWeb.pl

Skrypt chmury słów w HTML5

Opublikowano 5 lat temu -


Dzisiaj w porcji ciekawych skryptów nie lada gratka. Mianowicie skrypt jak i zarazem generator - wszystko w jednym co nieczęsto się zdarza. Otóż narzędzie to nosi nazwę dość oczywistą nazwę Word Cloud Generator i pozwala na wygenerowanie chmury słów za pomocą formularza na stronie twórcy lub za pomocą API wygenerować taką chmurę na swojej stronie internetowej.

Przy pierwszej opcji, do wyboru mam kilka różnych źródeł do dyspozycji, skąd pobrane zostaną słowa kluczowe do zadanej frazy. Widnieje tam chociażby Twitter, gdzie dobierane są hashtagi czy nawet Wikipedia, gdzie pobierane są słowa z treści opisu. Jest jeszcze jedna bardzo wygodna opcja, otóż źródło wygenerowania słów można wybrać ręcznie, poprzez podanie adresu wybranej strony podając wartość {word} wybranym elemencie adresu (np. http://dailyweb.pl/tag/{word}). To jednak nie wszystko a dopiero skromna część możliwości skryptu.

W widoku generatora można zarządzać ustawieniami wygenerowanej chmury słów. Dla przykładu zakres kątów nachylenia wygenerowanych słów, wybór konkretnej czcionki czy też ilości wygenerowanych słów. Po wybraniu ustawień i wyświetlenie chmury, można zapisać ją w dwóch dostępnych formatach graficznych .SVG i .PNG.

Dla użytkowników bardziej zaawansowanych, można wykorzystać API skryptu. Niezbędne jednak do tego będzie dodatkowe narzędzie o nazwie d3-cloud. Gorąco polecam przyjrzeć się temu rozwiązaniu, ze względu na jego dość potężne możliwości i efekt miły dla oka.