Деталі електронної книги

D3.js w akcji

D3.js w akcji

Elijah Meeks

Eлектронна книга
D3.js jest biblioteką przeznaczoną do tworzenia zaawansowanych wizualizacji danych w rozmaitych aplikacjach internetowych. Ta solidnie zaprojektowana biblioteka oczywiście umożliwia generowanie wykresów, ale pozwala również na tworzenie map, interaktywnych diagramów, paneli kontrolnych dla danych, raportów i wielu innych animowanych elementów. Zapewnia co najmniej tę samą wydajność co Flash czy aplety Javy, ale jest zintegrowana ze standardami internetowymi i modelem DOM dla HTML. To nie koniec zalet D3.js — to także świetne narzędzie do dynamicznego aktualizowania bardziej standardowych witryn internetowych.

Niniejsza książka pozwoli Ci na płynne rozpoczęcie pracy z tą biblioteką, dającą fantastyczne możliwości. Nauczysz się, jak tworzyć interaktywną grafikę i aplikacje sterowane danymi. Zaczniesz od zestawu praktycznych przykładów, dostosowanych do różnego rodzaju wykresów, sieci i map. Wykorzystasz przy tym gotowe układy z biblioteki D3. Zapoznasz się z praktycznymi technikami projektowania zawartości stron, tworzenia animacji i prezentowania zmieniających się danych. Zobaczysz między innymi, jak tworzyć interaktywną grafikę i wykorzystywać dane przesyłane strumieniowo.

Dzięki tej książce zrozumiesz:
  • zasady wizualizacji danych,
  • techniki wiązania i wczytywania danych oraz tworzenia elementów graficznych na ich podstawie,
  • metody pracy z grafiką wektorową,
  • tworzenie elementów służących do wizualizacji danych,
  • rozbudowane aplikacje wykorzystujące mapy,
  • sposoby tworzenia kompletnych aplikacji opartych na bibliotece D3, również dla urządzeń przenośnych.

Przedmowa (9)

Podziękowania (11)

O książce (13)

CZĘŚĆ I. PODSTAWY BIBLIOTEKI D3.JS (17)

Rozdział 1. Wprowadzenie do biblioteki D3.js (19)

  • 1.1. Czym jest D3.js? (20)
  • 1.2. Jak działa biblioteka D3? (21)
    • 1.2.1. W wizualizacji danych ważne są nie tylko aspekty wizualne (22)
    • 1.2.2. W bibliotece D3 istotne są selekcja i wiązanie danych (26)
    • 1.2.3. Biblioteka D3 umożliwia określanie wyglądu elementów stron internetowych na podstawie powiązanych danych (27)
    • 1.2.4. Elementami strony mogą być elementy div, państwa lub diagramy przepływu (27)
  • 1.3. Stosowanie standardu HTML5 (28)
    • 1.3.1. Model DOM (29)
    • 1.3.2. Pisanie kodu w konsoli (34)
    • 1.3.3. SVG (34)
    • 1.3.4. Style CSS (39)
    • 1.3.5. JavaScript (44)
  • 1.4. Standardy dotyczące danych (49)
    • 1.4.1. Dane tabelaryczne (50)
    • 1.4.2. Dane zagnieżdżone (50)
    • 1.4.3. Dane sieciowe (50)
    • 1.4.4. Dane geograficzne (51)
    • 1.4.5. Dane surowe (51)
    • 1.4.6. Obiekty (53)
  • 1.5. Standardy z obszaru wizualizowania informacji stosowane w bibliotece D3 (54)
  • 1.6. Twoja pierwsza aplikacja oparta na bibliotece D3 (55)
    • 1.6.1. "Witaj, świecie" z elementami
      (56)
    • 1.6.2. "Witaj, świecie" z kołami (56)
    • 1.6.3. Komunikowanie się z biblioteką D3 (58)
  • 1.7. Podsumowanie (61)

Rozdział 2. Przepływ danych podczas wizualizowania informacji (63)

  • 2.1. Praca z danymi (64)
    • 2.1.1. Wczytywanie danych (64)
    • 2.1.2. Formatowanie danych (67)
    • 2.1.3. Przekształcanie danych (69)
    • 2.1.4. Pomiar danych (73)
  • 2.2. Wiązanie danych (74)
    • 2.2.1. Selekcje i wiązanie (74)
    • 2.2.2. Dostęp do danych za pomocą funkcji wewnątrzwierszowych (76)
    • 2.2.3. Uwzględnianie skal (79)
  • 2.3. Styl, atrybuty i treść w prezentacji danych (81)
    • 2.3.1. Wizualizacja oparta na wczytanych danych (82)
    • 2.3.2. Ustawianie kanałów (84)
    • 2.3.3. Instrukcje enter, update i exit (87)
  • 2.4. Podsumowanie (93)

Rozdział 3. Projektowanie sterowane danymi i interakcje (95)

  • 3.1. Architektura projektu (96)
    • 3.1.1. Dane (96)
    • 3.1.2. Zasoby (97)
    • 3.1.3. Rysunki (97)
    • 3.1.4. Arkusze stylów (97)
    • 3.1.5. Biblioteki zewnętrzne (98)
  • 3.2. Interaktywne style i model DOM (100)
    • 3.2.1. Zdarzenia (100)
    • 3.2.2. Przejścia graficzne (103)
    • 3.2.3. Manipulowanie modelem DOM (105)
    • 3.2.4. Sensowne korzystanie z kolorów (107)
  • 3.3. Wstępnie generowane treści (113)
    • 3.3.1. Rysunki (113)
    • 3.3.2. Fragmenty kodu w HTML-u (115)
    • 3.3.3. Wstępnie wygenerowana grafika SVG (116)
  • 3.4. Podsumowanie (122)

CZĘŚĆ II. PODSTAWY WIZUALIZOWANIA INFORMACJI (123)

Rozdział 4. Komponenty wykresów (125)

  • 4.1. Ogólne zasady tworzenia wykresów (126)
    • 4.1.1. Generatory (127)
    • 4.1.2. Komponenty (127)
    • 4.1.3. Układy (127)
  • 4.2. Tworzenie osi (128)
    • 4.2.1. Wyświetlanie danych (128)
    • 4.2.2. Określanie stylu osi (131)
  • 4.3. Złożone obiekty graficzne (135)
  • 4.4. Wykresy liniowe i interpolacja (143)
    • 4.4.1. Rysowanie linii od określonych punktów (145)
    • 4.4.2. Rysowanie wielu linii za pomocą kilku generatorów (147)
    • 4.4.3. Omówienie interpolacji linii (148)
  • 4.5. Złożone akcesory (149)
  • 4.6. Podsumowanie (158)

Rozdział 5. Układy (159)

  • 5.1. Histogramy (160)
  • 5.2. Wykresy kołowe (162)
    • 5.2.1. Rysowanie wykresu kołowego (163)
    • 5.2.2. Tworzenie wykresu pierścieniowego (165)
    • 5.2.3. Przejścia (166)
  • 5.3. Układy dla grup kół (168)
  • 5.4. Drzewa (172)
  • 5.5. Układy skumulowane (177)
  • 5.6. Wtyczki służące do dodawania układów (183)
    • 5.6.1. Diagram Sankeya (183)
    • 5.6.2. Chmury słów (190)
  • 5.7. Podsumowanie (195)

Rozdział 6. Wizualizowanie sieci (197)

  • 6.1. Statyczne diagramy sieci (198)
    • 6.1.1. Dane o sieci (199)
    • 6.1.2. Macierz sąsiedztwa (201)
    • 6.1.3. Diagram łukowy (205)
  • 6.2. Układ oparty na siłach (208)
    • 6.2.1. Tworzenie dla sieci diagramu opartego na siłach (209)
    • 6.2.2. Znaczniki SVG (210)
    • 6.2.3. Miary sieci (214)
    • 6.2.4. Ustawienia układu opartego na siłach (216)
    • 6.2.5. Aktualizowanie sieci (218)
    • 6.2.6. Usuwanie i dodawanie węzłów oraz krawędzi (219)
    • 6.2.7. Ręczne określanie pozycji węzłów (223)
    • 6.2.8. Optymalizacja (226)
  • 6.3. Podsumowanie (226)

Rozdział 7. Wizualizowanie informacji geoprzestrzennych (227)

  • 7.1. Podstawy tworzenia map (229)
    • 7.1.1. Szukanie danych (230)
    • 7.1.2. Rysowanie punktów na mapie (234)
    • 7.1.3. Odwzorowania i obszary (236)
    • 7.1.4. Interaktywność (238)
  • 7.2. Tworzenie lepszych map (239)
    • 7.2.1. Siatka kartograficzna (240)
    • 7.2.2. Operacja zoom (241)
  • 7.3. Zaawansowane aspekty map (244)
    • 7.3.1. Tworzenie i obracanie globusa (244)
    • 7.3.2. Odwzorowanie satelitarne (250)
  • 7.4. Dane i funkcje w bibliotece TopoJSON (251)
    • 7.4.1. Format plików TopoJSON (251)
    • 7.4.2. Wyświetlanie danych w formacie TopoJSON (252)
    • 7.4.3. Scalanie (253)
    • 7.4.4. Sąsiednie obiekty (255)
  • 7.5. Tworzenie map z kafelkami za pomocą instrukcji d3.geo.tile (256)
  • 7.6. Dalsza lektura związana z mapami (261)
    • 7.6.1. Zoom dla transformacji (262)
    • 7.6.2. Rysowanie na płótnie (262)
    • 7.6.3. Zmiana odwzorowania dla danych rastrowych (262)
    • 7.6.4. Technika hexbinning (262)
    • 7.6.5. Diagramy Woronoja (262)
    • 7.6.6. Mapy anamorficzne (262)
  • 7.7. Podsumowanie (263)

Rozdział 8. Manipulowanie tradycyjnym modelem DOM za pomocą biblioteki D3 (265)

  • 8.1. Przygotowania (267)
    • 8.1.1. Style CSS (267)
    • 8.1.2. Kod w HTML-u (268)
  • 8.2. Arkusz kalkulacyjny (268)
    • 8.2.1. Tworzenie arkusza kalkulacyjnego za pomocą tabeli (268)
    • 8.2.2. Tworzenie arkusza kalkulacyjnego za pomocą elementów
      (270)
    • 8.2.3. Dodawanie animacji do arkusza kalkulacyjnego (272)
  • 8.3. Płótno (273)
    • 8.3.1. Rysowanie na płótnie (275)
    • 8.3.2. Rysowanie i zapisywanie wielu obrazków (275)
  • 8.4. Galeria rysunków (277)
    • 8.4.1. Interaktywne wyróżnianie elementów modelu DOM (279)
    • 8.4.2. Selekcja elementów (281)
  • 8.5. Podsumowanie (283)

CZĘŚĆ III. TECHNIKI ZAAWANSOWANE (285)

Rozdział 9. Łączenie komponentów aplikacji interaktywnych (287)

  • 9.1. Jedno źródło danych, wiele perspektyw (289)
    • 9.1.1. Podstawy tworzenia panelu kontrolnego dla danych (291)
    • 9.1.2. Arkusz kalkulacyjny (292)
    • 9.1.3. Wykres słupkowy (293)
    • 9.1.4. Grupy kół (293)
    • 9.1.5. Zmiana wielkości wykresów na podstawie rozmiaru ekranu (294)
  • 9.2. Interaktywność - zdarzenia związane z kursorem myszy (296)
  • 9.3. Kontrolka wyboru zakresu (299)
    • 9.3.1. Tworzenie kontrolki wyboru zakresu (300)
    • 9.3.2. Ułatwianie korzystania z kontrolki wyboru zakresu (303)
    • 9.3.3. Zdarzenia kontrolki wyboru zakresu (306)
    • 9.3.4. Ponowne rysowanie komponentów (307)
  • 9.4. Podsumowanie (308)

Rozdział 10. Tworzenie układów i komponentów (311)

  • 10.1. Tworzenie układu (312)
  • 10.2. Pisanie własnych komponentów (319)
    • 10.2.1. Wczytywanie przykładowych danych (320)
    • 10.2.2. Wiązanie komponentów ze skalami (322)
    • 10.2.3. Dodawanie etykiet do komponentu (327)
  • 10.3. Podsumowanie (330)

Rozdział 11. Wizualizowanie dużych zbiorów danych (331)

  • 11.1. Duże zbiory danych geograficznych (332)
    • 11.1.1. Generowanie losowych danych geograficznych (334)
    • 11.1.2. Rysowanie danych geograficznych na płótnie (336)
    • 11.1.3. Techniki wyświetlania elementów w trybie mieszanym (338)
  • 11.2. Duże zbiory danych o sieciach (344)
  • 11.3. Optymalizowanie wybierania danych na podstawie współrzędnych x i y za pomocą drzew czwórkowych (349)
    • 11.3.1. Generowanie losowych danych o współrzędnych x i y (349)
    • 11.3.2. Wybór zakresu na podstawie współrzędnych x i y (349)
  • 11.4. Inne techniki optymalizacji (354)
    • 11.4.1. Unikanie ustawiania ogólnego stylu opacity (354)
    • 11.4.2. Unikanie ogólnych selekcji (355)
    • 11.4.3. Wstępne wyznaczanie pozycji (355)
  • 11.5. Podsumowanie (356)

Rozdział 12. Biblioteka D3 i urządzenia przenośne (357)

  • 12.1. Zasady tworzenia projektów sterowanych danymi dla urządzeń przenośnych (359)
  • 12.2. Wizualizacja i dotyk (359)
    • 12.2.1. Funkcja d3.touches (361)
    • 12.2.2. Rejestrowanie na liście zdarzeń związanych z dotykiem (361)
    • 12.2.3. Wizualizowanie zdarzeń związanych z dotykiem (362)
    • 12.2.4. Przesuwanie za pomocą jednego przeciągnięcia palcem (363)
    • 12.2.5. Wizualizowanie analizy dotknięć (365)
    • 12.2.6. Zoom oparty na szczypnięciach (367)
    • 12.2.7. Rotacja z użyciem trzech palców (370)
    • 12.2.8. Łączenie wszystkich elementów (371)
  • 12.3. Dostosowujące się wizualizacje danych (374)
    • 12.3.1. Tworzenie dostosowujących się wizualizacji danych (375)
    • 12.3.2. Tworzenie podstawowej wersji aplikacji (376)
    • 12.3.3. Rozwiązanie na skalę tabletu (380)
    • 12.3.4. Rozwiązanie dostosowane do telefonu (384)
    • 12.3.5. Automatyczne wykrywanie ekranów o różnych rozmiarach (389)
    • 12.3.6. Ogólne zasady tworzenia dostosowujących się wizualizacji danych (389)
  • 12.4. Geolokalizacja (389)
  • 12.5. Podsumowanie (390)

Skorowidz (393)

  • Назва: D3.js w akcji
  • Автор: Elijah Meeks
  • Оригінальна назва: D3.js in Action
  • Переклад: Radosław Lesisz, Tomasz Walczak
  • ISBN: 978-83-283-1826-7, 9788328318267
  • Дата видання: 2016-02-07
  • Формат: Eлектронна книга
  • Ідентифікатор видання: d3jsak
  • Видавець: Helion