More

D3.js mənim geoJSON sənədimi göstərə bilmir


I've been trying to draw maps using the d3.js library in a manner similar to that below.

Bütün bunlar dərsliyin ABŞ xəritələri üçün tamamilə FİN işləyir, istifadə etdiyi geojson bu d3 kitabxanası üçün yerdir.

İngiltərənin regional xəritələrini istədiyim kimi öz məlumat dəstimi əldə etmək üçün atdığım addımlar.

  1. Forma sənədlərini Ordnance Survey veb saytından yükləyin
  2. Mapshaper.org kimi saytlardan istifadə edərək faylları geojson-a çevirməyə cəhd edin (işləyir, saytlarında göstərilir)
  3. Xəritəni çəkmək üçün öz geojson sənədlərimi istifadə edirəm.

Nəsə çəkir, mənim sənədim düzgün formatda, amma bütün xəritəm dolğun rəngimə əsasən tərtib edilmişdir. Demək olar ki, koordinatlar düzgün deyil. Təbii ki, düzgün formatda olmayacaqlar.

Mənim shapefile mapshaper-da açıqdır: http://i.imgur.com/lz40BDn.png ">


YENİLƏNİB:

Probleminiz məlumatlarınızla əlaqəli görünür. Budur sənədinizin bir parçası:

}, "həndəsə": {"tip": "Çoxbucaqlı", "koordinatlar": [[[585951.8, 181704.9], [576293.9, 181299.8],

Səhv etmirəmsə, bu koordinatlar Ordnance Survey National Grid istinad sistemindən istifadə edir. Varsayılan olaraq, geoJSON koordinatların WGS84 (uzunluq, enlem) olmasını gözləyir. Forma sənədlərini yenidən konvertasiya etməyə və çıxış istinad sisteminin WGS84 olduğundan əmin ola bilərsiniz. Bunu QGIS-də faylı geoJSON olaraq qeyd edərək və çıxış koordinat istinad sistemi olaraq WGS84 seçərək edə bilərsiniz.

Nəticədə geoJSON yaxşı işləməlidir. Beləliklə, sualınıza cavab vermək üçün format düzgündür. Düzgün olmayan koordinatlardır.

Budur növbəti dəfə istinad üçün geoJSON spesifikası.


Problemin kodunuzun bəzi xüsusiyyətlərin geoJSON-da olmasını gözləməsidir. Kodda geoJSON faylının məzmunu ilə bağlı bəzi xüsusi fərziyyələr var. Məşqdəki geoJSON-u öz sənədinizlə əvəz edəcəyinizi və işləyəcəyini gözləməyəcəksiniz. Xüsusilə fərqli mənbələrdən olduğunuzda, sənədlərinizdəki atributların eyni olacağı ehtimalı çox azdır. Bir CSV-dən məlumatları görüntüləmək üçün yazılmış kodun bəzi düzəlişlər etmədən avtomatik olaraq fərqli bir CSV faylı ilə işləməsini gözləməzdiniz, elə deyilmi? Verilər dəyişdi və kod da dəyişməlidir. GeoJSON sənədlərinin məzmunu ilə müqayisə etmək və fərqləri yoxlamaqla başlaya bilərsiniz. Bunu mətn redaktoruna yükləmək və məzmunu müqayisə etməklə edə bilərsiniz. Kodun sənəddə nə gözlədiyinə baxın və buna görə çimdikləyin. Bunları QGIS-ə yükləyə və hansı xüsusiyyətlərin fərqli olduğunu görə bilərsiniz. GeoJSON formatı yalnız coğrafi məlumat strukturlarını necə kodlaya biləcəyinizi müəyyənləşdirir. Faylın məzmunu sizə aiddir. CSV-lərin yalnız cədvəlli məlumatların kodlaşdırılmasını sizə izah etdiyi kimi. Sütun adları və digər məzmunun məlumat istehsalçısına nə aiddir.

React və d3.js, d3 komponentinin ".setState ()" ilə göstərilməsini necə təmin etmək olar

Burada istifadə etdiyim react + d3.js haqqında olduqca yaxşı bir təlimat var. Sadəcə, məlumatları əyalətimdən BarChart.js sənədinə ötürdüm, məlumat dəstini yalnız bir ovuc müşahidəyə sadələşdirdim və x oxunu dörddə birinə dəyişdirdim. Mənim app.js-in müvafiq kodu:

Əslində, baş verməli olan şey, istifadəçinin vəziyyətin dəyərini yeniləyən bir sürgü dəyişdirə bilər. Bu sualın əhatə dairəsi üçün vəziyyətdəki məlumat massivindəki son maddəyə diqqət yetirək: . Konsol jurnalını yoxladıqdan sonra, sürgü əslində vəziyyəti yeniləyir - yəni istifadəçi sürgüyü 2000-ə qədər sürükləyə bilər və aum üçün dəyər bu məbləğə qədər yenilənəcəkdir. Məlumat massivindən 4-cü elementi necə kəsdiyimi öyrənmək üçün handleAUM funksiyasına baxın.

Yerli d3-də, məlumatları yenilədikdə, svg də dəyişəcək (hamarlaşdırmaq üçün animasiyalar da əlavə edə bilər, amma bunu hələlik tərk edirik). Ancaq burada olan şey, dövlətin yenilənməsi, lakin d3 barchartın bu yeniləmələri göstərməməsidir.

Mənim başa düşdüyüm budur ki, reaksiyanın dövləti universal şəkildə təqdim etməsi bu cür məsələləri kənara qoyacaq. Bəlkə də mən rekvizitləri düzgün ötürmürəm.

Baş verməli olan ən son (x oxunda ən çox sağ) çubuğun düzünün hündürlüyü dəyişdirilməlidir, çünki ona ötürülən rekvizitlərdəki məlumatlar həmin dövr üçün fərqli dəyərlərə sahib olacaqdır.


DOT (qrafik təsvir dili)

DOT qraf təsviri dilidir. DOT qrafikləri adətən fayl adı uzantısına sahib olan fayllardır gv və ya nöqtə. Uzatma gv uzadılması ilə qarışıqlığı qarşısını almaq üçün üstünlük verilir nöqtə 2007-dən əvvəl Microsoft Word versiyaları tərəfindən istifadə edilmişdir. [1]

DOT
Fayl adı uzantıları .gv
İnternet media növümətn / vnd.graphviz
Format növüQrafik təsvir dili
Format açıqdır? Bəli

Müxtəlif proqramlar DOT sənədlərini işləyə bilər. Kimi bəziləri nöqtə, neato, twopi, circo, fdpsfdp, bir DOT sənədini oxuya və qrafik şəklində göstərə bilər. Kimi digərləri gvpr, gc, siklik, ccomps, sccmaptred, DOT sənədlərini oxuyun və təmsil olunan qrafikdə hesablamalar aparın. Nəhayət, digərləri sol, nöqtəligrappa, interaktiv interfeys təmin edir. The GVedit alət mətn redaktorunu interaktiv olmayan görüntü görüntüləyicisi ilə birləşdirir. Əksər proqramlar Graphviz paketinin bir hissəsidir və ya daxili istifadə edin.


Komponent Renderini React React

React komponentinin göstərilməsini məcbur etməyin bir çox yolu var, lakin mahiyyət etibarilə eynidir. Birincisi, istifadə etməlidirComponentUpdate: this.forceUpdate () istifadə olunur:

Komponentinizin bir vəziyyətə sahib olduğunu fərz edərək, aşağıdakılara da zəng edə bilərsiniz:

Bu blog təlimatlı olmağı hədəfləmir, buna görə də inkişaf etdiriciləri bu kobud güc metodundan istifadə etdiyinə görə danlamam. Yenə də bir komponenti düzgün bir şəkildə göstərmək üçün daha yaxşı, daha çox "React-y" yolu var, ancaq bir komponenti əmrdə göstərməyə can atırsınızsa, bunu React ilə etmək üçün bir çox yol var.


D3.js geoJSON sənədimi göstərə bilmir - Coğrafi İnformasiya Sistemləri

Xəritə proqnozları bəzən nöqtə transformasiyası kimi həyata keçirilir. Məsələn, sferik Merkator:

Bu məqbul bir şeydir riyazi həndəsəniz fasiləsiz, sonsuz nöqtə dəstlərindən ibarətdirsə yanaşma. Yenə də kompüterlərin sonsuz yaddaşı yoxdur, buna görə çoxbucaqlı və çoxbucaqlılar kimi diskret həndəsə ilə işləməliyik!

Diskret həndəsə kürədən müstəviyə proyeksiya etməyi daha da çətinləşdirir. Kürə çoxbucaqlının kənarları düz xəttlər deyil, geodeziklərdir (böyük dairələrin seqmentləri). Təyyarəyə proqnozlaşdırılan geodeziya gnomonik xaricində bütün xəritə proyeksiyalarında əyrilərdir və beləliklə dəqiq proyeksiya hər yay boyunca interpolasiya tələb olunur. D3 dəqiqliyi və performansı tarazlaşdırmaq üçün populyar bir xətt sadələşdirmə metodundan ilhamlanaraq adaptiv nümunə götürür.

Çoxbucaqlı və çox xətlərin proyeksiyası, kürə ilə müstəvi arasındakı topoloji fərqlərlə də məşğul olmalıdır. Bəzi proqnozlar antimeridianı kəsən həndəsi kəsmə, bəziləri isə həndəsəni böyük bir dairəyə kəsmə tələb edir.

Sferik çoxbucaqlılar, çoxbucağın hansı tərəfinin iç olduğunu müəyyənləşdirmək üçün sarma əmri konvensiyasına ehtiyac duyur: yarımkürədən kiçik çoxbucaqlıların xarici üzüyü saat yönünün əksinə, yarımkürədən böyük poliqonların xarici üzüyü isə əksinə olmalıdır. Çuxurları təmsil edən daxili üzüklər xarici üzüklərinin əksinə sarma qaydasını istifadə etməlidir. Bu sarma qaydası konvensiyası TopoJSON və ESRI formalı sənədlər tərəfindən də istifadə olunur, lakin əksinə GeoJSON’un RFC 7946 konvensiyası. (Həm də nəzərə alın ki, standart GeoJSON WGS84 sferik koordinatlar deyil, düzənlikli düzbucaqlı koordinatlar istifadə edir və buna görə antimeridian kəsikləri çıxarmaq üçün dikiş tələb edə bilər.)

D3-in yanaşması çox ifadəli olur: məlumatlarınız üçün doğru proyeksiyanı və doğru tərəfi seçə bilərsiniz. D3 geniş yayılmış və qeyri-adi xəritə proqnozlarını dəstəkləyir. Daha çox məlumat üçün Toolmaker’s Guide’ın 2. hissəsinə baxın.

D3, JavaScript-də coğrafi xüsusiyyətləri təmsil etmək üçün GeoJSON istifadə edir. (Buna da baxın, əhəmiyyətli dərəcədə daha yığcam və topologiyanı kodlayan GeoJSON-un bir uzantısı olan TopoJSON.) Şef formalarını GeoJSON-a çevirmək üçün shapefile paketinin bir hissəsi olan shp2json istifadə edin. D3-geo və əlaqəli alətlərə giriş üçün Komanda Xətti Kartoqrafiyasına baxın.

Npm istifadə edirsinizsə, npm d3-geo quraşdırın. Ən son versiyanı GitHub-dan da yükləyə bilərsiniz. Müasir brauzerlərdə vanil HTML üçün Skypack-dən d3-geo idxal edin:

Əvvəlki mühitlər üçün d3-geo’nın UMD paketini jsDelivr a d3 global ixrac edildiyi kimi npm əsaslı CDN-dən yükləyə bilərsiniz:

Coğrafi yol generatoru, d3.geoPath, d3 şəklində forma generatorlarına bənzəyir: bir GeoJSON həndəsi və ya xüsusiyyət obyekti verilərkən, bir SVG yolu məlumat sətri yaradır və ya bir Canvas yolunu göstərir. Kətan, performansı artırmaq üçün dinamik və ya interaktiv proqnozlar üçün tövsiyə olunur. Yollar proyeksiya və ya transformasiya ilə istifadə edilə bilər və ya düz düz həndəsəni birbaşa Canvas və ya SVG-ə çatdırmaq üçün istifadə edilə bilər.

# d3.geoPath([proyeksiya[, Kontekst]]) & lt & gt

Varsayılan parametrləri ilə yeni bir coğrafi yol generatoru yaradır. Əgər proyeksiya göstərilir, cari proyeksiyanı təyin edir. Əgər Kontekst göstərilir, cari konteksti təyin edir.

# yol(obyekt[, arqumentlər…]) & lt & gt

Verilənləri göstərir obyekt, hər hansı bir GeoJSON xüsusiyyəti və ya həndəsə obyekti ola bilər:

  • Point - tək bir mövqe.
  • MultiPoint - bir sıra mövqelər.
  • LineString - davamlı bir xətt təşkil edən bir sıra mövqelər.
  • MultiLineString - bir neçə sətir yaradan mövqelərdən ibarət olan bir sıra.
  • Çoxbucaqlı - çoxbucaqlı yaradan mövqelərin bir sıra (ola bilsin deşikli).
  • MultiPolygon - çoxbucaqlı əmələ gətirən çoxölçülü mövqelər.
  • GeometryCollection - bir sıra həndəsə obyektləri.
  • Xüsusiyyət - yuxarıdakı həndəsə obyektlərindən birini ehtiva edən bir xüsusiyyət.
  • FeatureCollection - bir sıra xüsusiyyət obyektləri.

Növü Sahə həmçinin kürənin konturunu koordinatları olmayan göstərmək üçün faydalı olan dəstəklənir. Əlavə arqumentlər pointRadius accessor-a keçir.

Birdən çox xüsusiyyəti göstərmək üçün onları bir xüsusiyyət kolleksiyasına birləşdirin:

Və ya birdən çox yol elementindən istifadə edin:

Ayrı yol elementləri ümumiyyətlə bir yol elementindən daha yavaş olur. Bununla birlikdə, fərqli yol elementləri üslub və qarşılıqlı əlaqə üçün faydalıdır (məsələn, klik və ya siçan əlavə etmək). Kətan göstərilməsi (bax yol.context) adətən SVG-dən daha sürətli olur, lakin üslub və qarşılıqlı əlaqəni həyata keçirmək üçün daha çox səy tələb olunur.

# yol.sahə(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON üçün proqnozlaşdırılan planar sahəni (ümumiyyətlə kvadrat piksel şəklində) qaytarır obyekt. Point, MultiPoint, LineString və MultiLineString həndəsələri sıfır sahəyə malikdir. Polygon və MultiPolygon həndəsələri üçün bu üsul əvvəlcə xarici üzük sahəsini hesablayır və sonra hər hansı bir daxili çuxurun sahəsini çıxardır. Bu üsul, baxın proyeksiyası tərəfindən həyata keçirilən hər hansı bir kəsmə müşahidə olunur proyeksiya.clipAngle və proyeksiya.clipExtent. Bu, d3.geoArea-nın düzənlik ekvivalentidir.

# yol.sərhədlər(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON üçün proqnozlaşdırılan planar sərhəd qutusunu (ümumiyyətlə piksel şəklində) qaytarır obyekt. Haşiyə qutusu iki ölçülü bir sıra ilə təmsil olunur: [[x₀, y₀], [x₁, y₁]], harada x₀ minimumdur x- koordinat, y₀ minimumdur y- koordinat, x₁ maksimumdur x- əlaqələndirin və y₁ maksimumdur y- koordinat. Bu, müəyyən bir xüsusiyyəti yaxınlaşdırmaq üçün əlverişlidir. (Qeyd edək ki, proqnozlaşdırılan planar koordinatlarda minimum enlik ümumiyyətlə maksimumdur y-value və maksimum enlik adətən minimumdur y-Dəyər.) Bu metod baxın proyeksiyası ilə yerinə yetirilən hər hansı bir kəsmə müşahidə olunur proyeksiya.clipAngle və proyeksiya.clipExtent. Bu, d3.geoBounds-un müstəvisidir.

# yol.centroid(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON üçün proqnozlaşdırılan planar santroidi (ümumiyyətlə piksel şəklində) qaytarır obyekt. Bu, deyək ki, əyalət və ya mahal sərhədlərini etiketləmək və ya bir simvol xəritəsini göstərmək üçün əlverişlidir. Məsələn, bitişik olmayan bir kartoqram hər bir dövləti öz mərkəzinin ətrafında ölçə bilər. Bu metod, proyeksiya baxın tərəfindən həyata keçirilən hər hansı bir kəsmə işini müşahidə edir proyeksiya.clipAngle və proyeksiya.clipExtent. Bu, d3.geoCentroid-in planar ekvivalentidir.

# yol.ölçü(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON üçün proqnozlaşdırılan planar uzunluğu (ümumiyyətlə piksel şəklində) qaytarır obyekt. Point və MultiPoint həndəsələri sıfır uzunluğa malikdir. Polygon və MultiPolygon həndəsələri üçün bu metod bütün üzüklərin cəmlənmiş uzunluğunu hesablayır. Bu üsul, baxın proyeksiyası tərəfindən həyata keçirilən hər hansı bir kəsmə müşahidə olunur proyeksiya.clipAngle və proyeksiya.clipExtent. Bu, d3.geoLength-nin müstəvisidir.

# yol.proyeksiya([proyeksiya]) & lt & gt

Əgər proyeksiya göstərilir, cari proyeksiyanı göstərilən proyeksiyaya təyin edir. Əgər proyeksiya göstərilməyib, cari proyeksiyanı qaytarır, bu zaman standart olaraq sıfır olur. Sıf proyeksiya şəxsiyyət çevrilməsini təmsil edir: giriş həndəsəsi proqnozlaşdırılmır və əvəzinə birbaşa xam koordinatlarda göstərilir. Bu əvvəlcədən proqnozlaşdırılan həndəsənin sürətli göstərilməsi və ya bərabər düzbucaqlı proyeksiyanın sürətli göstərilməsi üçün faydalı ola bilər.

Verilmişdir proyeksiya tipik olaraq D3-in daxili coğrafi proqnozlarından biridir, lakin a proyeksiya.stream funksiyası istifadə edilə bilər ki, bu da xüsusi proqnozların istifadəsini təmin edir. Təsadüfi həndəsi çevrilmələrin daha çox nümunəsi üçün D3’ün çevrilməsinə baxın.

# yol.Kontekst([Kontekst]) & lt & gt

Əgər Kontekst göstərilir, mövcud göstərmə kontekstini təyin edir və yol generatorunu qaytarır. Əgər Kontekst boşdur, kontekst boş olduqda yol generatoru bir SVG yol sətrini qaytaracaq, həndəsə göstərmək üçün təyin olunan kontekstdə metodlar çağıracaq. Kontekst, CanvasRenderingContext2D API-nin aşağıdakı alt hissəsini tətbiq etməlidir:

  • Kontekst.beginPath ()
  • Kontekst.köçmək(x, y)
  • Kontekst.lineTo (x, y)
  • Kontekst.arc (x, y, radius, startAngle, endAngle)
  • Kontekst.closePath ()

Əgər Kontekst göstərilməyibsə, əvvəlcədən sıfır olan cari göstərmə kontekstini qaytarır.

# yol.pointRadius([radius]) & lt & gt

Əgər radius göstərilib, Point və MultiPoint həndəsələrini göstərmək üçün istifadə olunan radiusu göstərilən sayda təyin edir. Əgər radius göstərilməyib, cari radius girişini qaytarır; bu, standart olaraq 4.5-ə bərabərdir. Radius ümumiyyətlə bir ədədi sabit olaraq təyin edilsə də, hər bir xüsusiyyətə görə hesablanan və yol generatoruna ötürülən hər hansı bir arqumenti ötürən bir funksiya olaraq da təyin edilə bilər. Məsələn, GeoJSON məlumatlarınızın əlavə xüsusiyyətləri varsa, nöqtə ölçüsünü alternativ olaraq dəyişmək üçün radius funksiyasının içindəki bu xüsusiyyətlərə daxil ola bilərsiniz, daha çox elastiklik üçün d3.symbol və proyeksiya edə bilərsiniz.

Proqnozlar sferik çoxbucaqlı həndəsəni düzbucaqlı həndəsəyə çevirir. D3 standart proqnozların bir neçə sinifinin tətbiqini təmin edir:

# proyeksiya(nöqtə) & lt & gt

Yeni bir sıra qaytarır [x, y] verilənin proqnozlaşdırılan nöqtəsini təmsil edən (ümumiyyətlə piksel şəklində) nöqtə. Nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə. Göstərilən halda sıfır geri qayıda bilər nöqtə nöqtənin proyeksiyanın kəsmə hüdudlarından kənarda olması kimi müəyyən bir proqnozlaşdırılan mövqeyi yoxdur.

# proyeksiya.tərs(nöqtə) & lt & gt

Yeni bir sıra qaytarır [uzunluq, enlik] verilmiş proqnozlaşdırılan nöqtənin proqnozlaşdırılmayan nöqtəsini təmsil edən dərəcələrdə nöqtə. Nöqtə iki elementli bir sıra kimi göstərilməlidir [x, y] (ümumiyyətlə piksel şəklində). Göstərildiyi təqdirdə sıfır qayıda bilər nöqtə nöqtənin proyeksiyanın kəsmə hüdudlarından kənarda olması kimi müəyyən bir proqnozlaşdırılan mövqeyi yoxdur.

Bu metod yalnız çevrilə bilən proyeksiyalarda müəyyən edilir.

# proyeksiya.axın(axın) & lt & gt

Müəyyən edilmiş çıxış üçün proyeksiya axını qaytarır axın. Hər hansı bir giriş həndəsi çıxış axınına axın etmədən əvvəl proqnozlaşdırılır. Tipik bir proyeksiya bir neçə həndəsi transformasiyanı əhatə edir: giriş həndəsi əvvəlcə radianlara çevrilir, üç ox üzərində fırlanır, kiçik dairəyə kəsilir və ya antimeridian boyunca kəsilir və son olaraq adaptiv yenidənqurma, miqyas və tərcümə ilə müstəviyə yansıtılır.

# proyeksiya.preklip([preklip])

Əgər preklip göstərilib, proyeksiyanın sferik kəsilməsini göstərilən funksiyaya qoyur və proyeksiyanı qaytarır. Əgər preklip göstərilməyibsə, cari sferik kəsmə funksiyasını qaytarır (bax preklip).

# proyeksiya.postplip([postplip])

Əgər postplip göstərilir, proyeksiyanın kartezyen kəsilməsini göstərilən funksiyaya qoyur və proyeksiyanı qaytarır. Əgər postplip göstərilməyib, cari kartezyen kəsmə funksiyasını qaytarır (bax postplip).

# proyeksiya.clipAngle([bucaq]) & lt & gt

Əgər bucaq göstərilib, proyeksiyanın kəsmə dairəsi radiusunu dərəcə ilə müəyyən açıya qoyur və proyeksiyanı qaytarır. Əgər bucaq sıfırdır, kiçik dairəvi kəsmə yerinə antimeridian kəsilməyə keçir. Əgər bucaq göstərilməyib, cari klip açısını sıfıra qaytarır. Kiçik dairəvi kəsmə, görünüş saytı kəsməsindən asılı deyil proyeksiya.clipExtent.

# proyeksiya.clipExtent([dərəcə]) & lt & gt

Əgər dərəcə göstərilib, proyeksiyanın baxış klipinin ölçüsünü piksellərlə göstərilən hədlərə təyin edir və proyeksiyanı qaytarır. The dərəcə sərhədlər bir sıra kimi göstərilir [[x₀, y₀], [x₁, y₁]], harada x₀ görünüşün sol tərəfidir, y₀ üstdür, x₁ haqlıdır və y₁ altdır. Əgər dərəcə boşdur, heç bir baxış yeri kəsmə həyata keçirilmir. Əgər dərəcə göstərilməyibsə, cari baxış klipinin ölçüsünü null olaraq qaytarır.Viewport kəsmə vasitəsi ilə kiçik dairəvi kəsimdən asılı deyil proyeksiya.clipAngle.

# proyeksiya.miqyaslı([miqyaslı]) & lt & gt

Əgər miqyaslı göstərilir, proyeksiyanın miqyas faktorunu göstərilən dəyərə təyin edir və proyeksiyanı qaytarır. Əgər miqyaslı göstərilməyib, cari miqyas faktorunu qaytarır, standart miqyas proyeksiyaya xasdır. Miqyas faktoru, proqnozlaşdırılan nöqtələr arasındakı məsafəyə xətti olaraq uyğundur, lakin mütləq miqyaslı amillər proyeksiyalar arasında ekvivalent deyildir.

# proyeksiya.tərcümə etmək([tərcümə etmək]) & lt & gt

Əgər tərcümə etmək göstərilib, proyeksiyanın tərcümə ofsetini göstərilən iki elementli massivə qoyur [tx, ty] və proyeksiyanı qaytarır. Əgər tərcümə etmək göstərilməyib, cari tərcümənin ofsetini qaytarır, bu da [480, 250]. Tərcümə ofset proyeksiya mərkəzinin piksel koordinatlarını təyin edir. Varsayılan tərcümə ofset, 960 × 500 sahənin mərkəzində ⟨0 °, 0 ° places yerləşdirir.

# proyeksiya.Mərkəz([Mərkəz]) & lt & gt

Əgər Mərkəz göstərilib, proyeksiyanın mərkəzini göstərilənə uyğunlaşdırır Mərkəz, iki elementli bir sıra [uzunluq, enlik] dərəcə ilə göstərir və proyeksiyanı qaytarır. Əgər Mərkəz göstərilməyib, center0 °, 0 ° to olan cari mərkəzi qaytarır.

# proyeksiya.bucaq([bucaq]) & lt & gt

Əgər bucaq göstərilib, proyeksiyanın proyeksiyadan sonrakı planar fırlanma bucağını göstərilənə uyğunlaşdırır bucaq dərəcə ilə və proyeksiyanı qaytarır. Əgər bucaq göstərilməyib, proyeksiyanın cari açısını qaytarır və bu, 0 ° -ə bərabərdir. Render zamanı dönməyin daha sürətli ola biləcəyini unutmayın (məsələn, istifadə etməklə) Kontekst.döndürmə) proyeksiya zamanı deyil.

# proyeksiya.əks etdirən X([əks etdirmək])

Əgər əks etdirmək müəyyən edilir, olub olmadığını təyin edir x-ölçü çıxışda əks olunur (inkar olunur). Əgər əks etdirmək göstərilməyibsə, true qaytarır x-flektasiya aktivdir, bu da defolt olaraq yalan olur. Aşağıdan görünən kürə ilə göy və astronomik məlumatları göstərmək üçün faydalı ola bilər: Şimal yuxarıya doğru doğru qalxdıqda (şərq istiqaməti) sola yönələcəkdir.

# proyeksiya.əks etdirirY([əks etdirmək])

Əgər əks etdirmək müəyyən edilir, olub olmadığını təyin edir y-ölçü çıxışda əks olunur (inkar olunur). Əgər əks etdirmək göstərilməyibsə, true qaytarır y-flektasiya aktivdir, bu da defolt olaraq yalan olur. Bu, xüsusilə pozitiv davranan standart məkan istinad sistemlərindən çevrilmək üçün faydalıdır y yuxarıya doğru yönəldərək, Canvas və SVG kimi pozitiv davranan koordinat sistemlərini göstərmək y aşağı işarə kimi.

# proyeksiya.döndürün([bucaqlar]) & lt & gt

Əgər fırlanma göstərilib, proyeksiyanın üç oxlu kürə fırlanmasını göstərilənə uyğunlaşdırır bucaqlar, iki və ya üç elementli bir sıra olmalıdır [lambda, phi, qamma] hər kürə oxu ətrafında fırlanma açılarının dərəcə ilə göstərilməsi. (Bunlar yaw, pitch və roll ilə uyğundur.) Fırlanma bucağı varsa qamma buraxılmışdır, bu, 0-a bərabərdir. Həmçinin bax d3.geoRotation. Əgər fırlanma göstərilməyib, defolt edilmiş cari fırlanmanı qaytarır [0, 0, 0].

# proyeksiya.dəqiqlik([dəqiqlik]) & lt & gt

Əgər dəqiqlik göstərilib, proyeksiyanın adaptiv yenidən nümunə götürülmə həddini piksel şəklində göstərilən dəyərə təyin edir və proyeksiyanı qaytarır. Bu dəyər Douglas-Peucker məsafəsinə uyğundur. Əgər dəqiqlik göstərilməyib, proyeksiyanın cari yenidən seçmə dəqiqliyini qaytarır və bu parametr √0.5 ≅ 0.70710 səviyyəsinə qaytarılır ...

# proyeksiya.fitExtent(dərəcə, obyekt) & lt & gt

Proyeksiyanın miqyasını təyin edir və tərcümə olunan GeoJSON-a uyğunlaşdırın obyekt verilən mərkəzdə dərəcə. Dərəcə [[x₀, y₀], [x₁, y₁]] bir sıra kimi göstərilir, burada x₀ hüdud qutusunun sol tərəfi, y₀ yuxarı, x₁ sağ, y₁ isə altdır. Proyeksiyanı qaytarır.

Məsələn, New Jersey State Plane proyeksiyasını bir GeoJSON obyektinə uyğunlaşdırmaq üçün miqyaslaşdırmaq və tərcümə etmək nj hər tərəfində 20 piksel yastığı olan 960 × 500 haşiyə qutusunun mərkəzində:

Yeni miqyas təyin edərkən və tərcümə edərkən hər hansı bir klip dərəcəsi nəzərə alınmır. Verilənin məhdudlaşdırıcı qutusunu hesablamaq üçün istifadə olunan dəqiqlik obyekt effektiv miqyasda 150 hesablanır.

# proyeksiya.fit ölçüsü(ölçüsü, obyekt) & lt & gt

Üçün bir rahatlıq metodu proyeksiya.fitExtent, ölçü dərəcəsinin yuxarı sol küncü [0, 0]. Aşağıdakı iki ifadə bərabərdir:

# proyeksiya.uyğun genişlik(eni, obyekt) & lt & gt

Üçün bir rahatlıq metodu proyeksiya.FitSize, hündürlüyün avtomatik olaraq en nisbət nisbətindən avtomatik olaraq seçilir obyekt və verilən məhdudiyyət eni.

# proyeksiya.fitHeight(hündürlük, obyekt) & lt & gt

Üçün bir rahatlıq metodu proyeksiya.FitSize, enin avtomatik olaraq en nisbət nisbətindən avtomatik olaraq seçilir obyekt və verilən məhdudiyyət hündürlük.

Azimutal proqnozlar kürəni birbaşa təyyarəyə proyeksiya edir.

# d3.geoAzimuthalEqualArea() & lt & gt
# d3.geoAzimuthalEqualAreaRaw

Azimutal bərabər sahəli proyeksiya.

# d3.geoAzimuthalEquidistant() & lt & gt
# d3.geoAzimuthalEquidistantRaw

Azimutal bərabər məsafəli proyeksiya.

# d3.geoGnomonic() & lt & gt
# d3.geoGnomonicRaw

# d3.geofiziki() & lt & gt
# d3.geoOrthographicRaw

Orfoqrafiya proyeksiyası.

# d3.geoStereoqrafik() & lt & gt
# d3.geoStereographicRaw

Stereoqrafik proyeksiya.

# d3.geoEqualEarth() & lt & gt
# d3.geoEqualEarthRaw

Bojan Šavrič tərəfindən hazırlanan Bərabər Yer proyeksiyası və s., 2018.

Kompozit bir ekrana daxil olan bir neçə proqnozdan ibarətdir. Qurucu proqnozlarda sabit klip, mərkəz və dönmə var və bu səbəbdən kompozit proyeksiyalar dəstəklənmir proyeksiya.Mərkəz, proyeksiya.duzlamaq, proyeksiya.clipAngle və ya proyeksiya.clipExtent.

Bu, üç d3.geoConicEqualArea proyeksiyasından ibarət ABŞ mərkəzli bir kompozit proyeksiyadır: d3.geoAlbers alt qırx səkkiz əyalət üçün, ayrı-ayrı konik bərabər ərazi proyeksiyaları isə Alyaska və Havay üçün istifadə olunur. Alyaska üçün miqyasın azaldığına diqqət yetirin: həqiqi nisbi sahəsi 0.35 × -də proqnozlaşdırılır. Philippe Rivière tərəfindən hazırlanan bu diaqram, bu proyeksiyanın Alyaska və Havay üçün iki düzbucaqlı içlikdən necə istifadə etdiyini göstərir:

ABŞ-ın bütün ərazilərinə bir uzantı üçün Albers USA ilə Territories və daha çox nümunə üçün d3-kompozit proyeksiyalara baxın.

Konik proyeksiyalar kürəni bir konus üzərində proyeksiya edir və sonra konini müstəviyə açın. Konik proyeksiyalar iki standart paralelə malikdir.

# konik.paralellər([paralellər]) & lt & gt

Konik proyeksiyalarda xəritə düzənini təyin edən iki standart paralel.

Albersin bərabər sahə-konik proyeksiyası. Bu, ABŞ mərkəzli d3.geoConicEqualArea konfiqurasiyasındadır.

# d3.geoConicConformal() & lt & gt
# d3.geoConicConformalRaw(phi0, phi1) & lt & gt

Konik konformal proyeksiya. Paralellər [30 °, 30 °] -ə bərabərdir və nəticədə üstü düz olur. Həmçinin bax konik.parallar.

# d3.geoConicEqualArea() & lt & gt
# d3.geoConicEqualAreaRaw(phi0, phi1) & lt & gt

Albers’in bərabər sahəli konik proyeksiyası. Həmçinin bax konik.parallar.

# d3.geoConicEquidistant() & lt & gt
# d3.geoConicEquidistantRaw(phi0, phi1) & lt & gt

Konik bərabər məsafəli proyeksiya. Həmçinin bax konik.parallar.

Silindrik proyeksiyalar kürəni tərkibində olan bir silindirə proqnozlaşdırır və sonra silindrini müstəviyə açır. Psevdosilindrik proyeksiyalar silindrik proyeksiyaların ümumiləşdirilməsidir.

# d3.coğrafi düzbucaqlı() & lt & gt
# d3.geoExirectangularRaw

Bərabər düzbucaqlı (boşqab karrée) proyeksiya.

# d3.geoMercator() & lt & gt
# d3.geoMercatorRaw

Sferik Mercator proyeksiyası. Bir defolt təyin edir proyeksiya.clipExtent, dünyanın bir kvadrat şəklində proqnozlaşdırıldığı, təqribən ± 85 ° enliyə endirildiyi.

# d3.geoTransverseMercator() & lt & gt
# d3.geoTransverseMercatorRaw

Eninə sferik Merkator proyeksiyası. Bir defolt təyin edir proyeksiya.clipExtent, dünyanın bir kvadrat şəklində proqnozlaşdırıldığı, təqribən ± 85 ° enliyə endirildiyi.

# d3.geoTəbiiEarth1() & lt & gt
# d3.geoTəbiiEarth1Xam

Natural Earth proyeksiyası Tom Patterson tərəfindən hazırlanmış yalançı silindrik bir proyeksiyadır. Nə konformal, nə də bərabər ərazidir, əksinə bütün dünyanın kiçik ölçülü xəritələri üçün göz oxşayır.

Xam proqnozlar, ümumiyyətlə d3.geoProjection və ya d3.geoProjectionMutator-a ötürdükləri xüsusi proqnozları həyata keçirmək üçün istifadə olunan nöqtə çevrilmə funksiyalarıdır. Müvafiq proqnozların çıxarılmasını asanlaşdırmaq üçün burada məruz qalırlar. Xam proqnozlar sferik koordinatlar alır [lambda, phi] radyanla (dərəcə deyil!) və bir nöqtə qaytarmaq [x, y], adətən mənşə ətrafında mərkəzləşmiş vahid kvadratında.

# layihə(lambda, phi)

Göstərilən nöqtəni layihələşdirir [lambda, phi] radyanlarda, yeni bir nöqtə qaytaran [x, y] vahid koordinatlarda.

# layihə.tərs(x, y)

# d3.geoProjeksiyon(layihə) & lt & gt

Müəyyən edilmiş xam proyeksiyadan yeni bir proyeksiya qurur, layihə. The layihə funksiyası alır uzunluqenlik verilmiş bir nöqtənin radianlarda, tez-tez olaraq adlandırılır lambda (λ) və phi (φ) və iki elementli bir sıra qaytarır [x, y] vahid proyeksiyasını təmsil edir. The layihə avtomatik olaraq tətbiq olunduğu üçün funksiyanı nöqtəni ölçmək və ya tərcümə etmək lazım deyil proyeksiya.miqyas, proyeksiya.tərcümə edin və proyeksiya.Mərkəz. Eynilə, layihə funksiyası kimi hər hansı bir sferik fırlanma yerinə yetirməyə ehtiyac yoxdur proyeksiya.rotate proyeksiyadan əvvəl tətbiq olunur.

Məsələn, sferik Merkator proyeksiyası aşağıdakı kimi həyata keçirilə bilər:

Əgər layihə funksiyası bir tərs üsulla, döndürülmüş proyeksiya da ifşa olunacaq proyeksiya. tərs.

# d3.geoProjectionMutator(zavod) & lt & gt

Müəyyən edilmiş xam proyeksiyadan yeni bir proyeksiya qurur zavod və qayıdır a mutasiya xam proyeksiya dəyişəndə ​​zəng etmək funksiyası. The zavod xam proyeksiyanı qaytarmalıdır. Geri döndü mutasiya funksiyası bükülmüş proyeksiyanı qaytarır. Məsələn, konik proyeksiya, adətən, iki sazlana bilən paralelə malikdir. Uyğun zavod d3.geoConicEqualAreaRaw kimi funksiya aşağıdakı formaya sahib olardı:

D3.geoProjectionMutator istifadə edərək, d3.geoProjection tərəfindən daxili istifadə edilən xam proyeksiyanı yenidən təyin edərək paralellərin dəyişdirilməsinə imkan verən standart bir proyeksiya həyata keçirə bilərsiniz:

Dəyişdirilə bilən proyeksiya yaradarkən mutasiya funksiya ümumiyyətlə məruz qalmır.

# d3.coğrafi ərazi(obyekt) & lt & gt

Göstərilən GeoJSON-un sferik sahəsini qaytarır obyekt steradianlarda. Bu sferik ekvivalentdir yol.area.

# d3.geobound(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON üçün sferik məhdudlaşdırma qutusunu qaytarır obyekt. Haşiyə qutusu iki ölçülü bir sıra ilə təmsil olunur: [[sol, alt], [sağ, üst]], harada sol minimum uzunluq, alt minimum enlikdir, sağ maksimum boylamdır və üst maksimum enlikdir. Bütün koordinatlar dərəcə ilə verilir. (Qeyd edək ki, proqnozlaşdırılan planar koordinatlarda minimum enlik ümumiyyətlə maksimumdur y-value və maksimum enlik adətən minimumdur y-Dəyər.) Bu.-nin sferik ekvivalenti yol.həddlər.

# d3.geoCentroid(obyekt) & lt & gt

Göstərilən GeoJSON-un sferik santroidini qaytarır obyekt. Bu sferik ekvivalentdir yol.centroid.

# d3.coğrafi məsafə(a, b) & lt & gt

İki nöqtə arasındakı böyük qövs məsafəsini radianda qaytarır ab. Hər nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə. Bu sferik ekvivalentdir yol. iki nöqtədən ibarət bir LineString verilən tədbir.

# d3.coğrafi uzunluq(obyekt) & lt & gt

Müəyyən olunmuş GeoJSON-un böyük yay uzunluğunu qaytarır obyekt radianlarda. Çoxbucaqlar üçün xarici üzük ətrafını və daxili üzüklərin perimetrini qaytarır. Bu sferik ekvivalentdir yol. ölçü.

# d3.geoInterpolate(a, b) & lt & gt

İki nöqtə verilmiş bir interpolator funksiyasını qaytarır ab. Hər nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə. Qaytarılmış interpolator funksiyası tək bir arqument götürür t, harada t 0-dan 1-ə qədər olan bir rəqəmdir, 0 dəyəri nöqtəni qaytarır a, 1 dəyəri nöqtəni qaytarır b. Aralıq dəyərlər a üçün b hər ikisindən keçən böyük qövs boyunca ab. Əgər ab antipodlardır, təsadüfən böyük bir qövs seçilir.

# d3.geoContains(obyekt, nöqtə) & lt & gt

Yalnız göstərilən GeoJSON olduğu təqdirdə doğru qayıdır obyekt göstərilənləri ehtiva edir nöqtəvə ya saxta obyekt ehtiva etmir nöqtə. Nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə. Point və MultiPoint həndəsələri üçün bir Sfera üçün dəqiq bir test istifadə edilir, digər həndəsələr üçün true həmişə qaytarılır, epsilon hüdudu tətbiq olunur.

# d3.geoRotation(bucaqlar) & lt & gt

Verilmiş üçün fırlanma funksiyasını qaytarır bucaqlar, iki və ya üç elementli bir sıra olmalıdır [lambda, phi, qamma] hər kürə oxu ətrafında fırlanma açılarının dərəcə ilə göstərilməsi. (Bunlar yaw, pitch və roll ilə uyğundur.) Fırlanma bucağı varsa qamma buraxılmışdır, bu, 0-a bərabərdir. Həmçinin baxın proyeksiya.deyir

Yeni bir sıra qaytarır [uzunluq, enlik] verilmişin dönmüş nöqtəsini təmsil edən dərəcələrdə nöqtə. Nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə.

# fırlanma.tərs(nöqtə) & lt & gt

Yeni bir sıra qaytarır [uzunluq, enlik] verilmiş nöqtəni təmsil edən dərəcələrdə nöqtə tərs fırlanma. Nöqtə iki elementli bir sıra kimi göstərilməlidir [uzunluq, enlik] dərəcə ilə.

Möhtəşəm bir qövs (böyük dairənin bir hissəsi) yaratmaq üçün bir GeoJSON LineString həndəsə obyektini d3.geoPath-a ötürmək kifayətdir. D3-nin proqnozları, orta nöqtələr üçün böyük yay interpolasiyasından istifadə edir, beləliklə əla yay forması generatoruna ehtiyac yoxdur.

Yeni bir dairə generatoru qaytarır.

# dairə(arqumentlər…) & lt & gt

Cari mərkəz, radius və dəqiqliklə kürənin səthindəki dairəni yaxınlaşdıran “Polygon” tipli yeni bir GeoJSON həndəsə obyektini qaytarır. Hər hansı arqumentlər daxiledicilərə ötürülür.

# dairə.Mərkəz([Mərkəz]) & lt & gt

Əgər Mərkəz göstərilir, dairə mərkəzini göstərilən nöqtəyə qoyur [uzunluq, enlik] dərəcə ilə və bu dairə generatorunu qaytarır. Mərkəz həmçinin bir funksiya olaraq göstərilə bilər, bu funksiya dairə yaradıldıqda, dairə generatoruna ötürülən hər hansı bir arqument ötürülərək çağırılacaqdır. Əgər Mərkəz göstərilməyibsə, cari mərkəzə daxil olanı qaytarır, bu zaman standart olaraq:

# dairə.radius([radius]) & lt & gt

Əgər radius göstərilib, dairə radiusunu göstərilən bucağa dərəcə ilə təyin edir və bu dairə generatorunu qaytarır. Radius da bir funksiya olaraq göstərilə bilər, bu funksiya dairə yaradıldıqda, dairə generatoruna ötürülən hər hansı bir arqument ötürülərək çağırılacaqdır. Əgər radius göstərilməyib, cari radius girişini qaytarır;

# dairə.dəqiqlik([bucaq]) & lt & gt

Əgər dəqiqlik göstərilir, dairə dəqiqliyini göstərilən açıya dərəcə ilə təyin edir və bu dairə generatorunu qaytarır. Dəqiqlik bir funksiya olaraq da təyin oluna bilər, bu funksiya bir dairə yaradıldıqda, dairə generatoruna ötürülən hər hansı bir arqument ötürülərək çağırılacaqdır. Əgər dəqiqlik göstərilməyib, cari dəqiqlik əldə edəni qaytarır, bu zaman standart olaraq:

Kiçik dairələr möhtəşəm qövsləri izləmir və beləliklə əmələ gələn çoxbucaq yalnız təqribidir. Daha kiçik bir həssaslıq bucağının göstərilməsi təxmini poliqonun dəqiqliyini artırır, eyni zamanda onu yaratmaq və göstərmək üçün xərcləri artırır.

Graticules yaratmaq üçün bir həndəsə generatoru qurur: meridianların vahid bir şəbəkəsi və proyeksiya təhrifini göstərmək üçün paralellər. Varsayılan qratikulda qütb bölgələri üçün ± 80 ° enlik arasında hər 10 ° -də meridianlar və paralellər var, hər 90 ° -də hər meridyen var.

Bu graticule üçün bütün meridianları və paralelləri təmsil edən bir GeoJSON MultiLineString həndəsə obyektini qaytarır.

Hər meridian üçün bir və ya bu qrafik üçün paralel bir sıra GeoJSON LineString həndəsə obyektlərini qaytarır.

# qarmaqarışıq.kontur() & lt & gt

Bu qarmaqarışın konturunu təmsil edən bir GeoJSON Polygon həndəsə obyektini qaytarır, yəni onun dərəcəsini təyin edən meridianlar və paralellər boyunca.

# qarmaqarışıq.dərəcə([dərəcə]) & lt & gt

Əgər dərəcə göstərilib, bu qarmaqarışın əsas və kiçik ölçüsünü təyin edir. Əgər dərəcə göstərilməyib, əvvəlcədən ⟨⟨-180 °, -80 ° - ε⟩, ⟨180 °, 80 ° + to olan cari kiçik dərəcəni qaytarır.

# qarmaqarışıq.böyükdür([dərəcə]) & lt & gt

Əgər dərəcə göstərilib, bu qarmaqarışın əsas dərəcəsini təyin edir. Əgər dərəcə göstərilməyib, major-180 °, -90 ° + ε⟩, ⟨180 °, 90 ° - to -ə dəyişən cari böyük dərəcəni qaytarır.

# qarmaqarışıq.ölçüdə kiçik([dərəcə]) & lt & gt

Əgər dərəcə göstərilib, bu qarmaqarışığın kiçik dərəcəsini təyin edir. Əgər dərəcə göstərilməyib, əvvəlcədən ⟨⟨-180 °, -80 ° - ε⟩, ⟨180 °, 80 ° + to olan cari kiçik dərəcəni qaytarır.

# qarmaqarışıq.addım([addım]) & lt & gt

Əgər addım göstərilib, bu graticule üçün böyük və kiçik addımı təyin edir. Əgər addım göstərilməyib, a10 °, 10 ° to olan cari kiçik addımı qaytarır.

# qarmaqarışıq.stepMajor([addım]) & lt & gt

Əgər addım göstərilib, bu graticule üçün əsas addımı təyin edir. Əgər addım göstərilməyib, əvvəlcədən step90 °, 360 ° to olan cari əsas addımı qaytarır.

# qarmaqarışıq.stepMinor([addım]) & lt & gt

Əgər addım göstərilir, bu graticule üçün kiçik addımı təyin edir. Əgər addım göstərilməyib, a10 °, 10 ° to olan cari kiçik addımı qaytarır.

# qarmaqarışıq.dəqiqlik([bucaq]) & lt & gt

Əgər dəqiqlik göstərilir, bu graticule üçün dəqiqliyi dərəcə ilə təyin edir. Əgər dəqiqlik göstərilməyib, cari dəqiqliyi qaytarır;

Bir GeoJSON MultiLineString həndəsə obyekti olaraq birbaşa 10 ° qlobal qrafik şəklini yaratmaq üçün rahatlıq metodu. Bərabərdir:

D3 yükü minimuma endirmək üçün aralıq təsvirləri maddi təmin etmək əvəzinə funksiya çağırışlarının ardıcıllığını istifadə edərək həndəsəni dəyişdirir. Axınlar giriş həndəsəsini qəbul etmək üçün bir neçə metod tətbiq etməlidir. Axınlar mahiyyət etibarilə dövlətdir, nöqtənin mənası nöqtənin bir xəttin içərisində olub olmamasından asılıdır və eyni şəkildə bir xətt bir çoxbucaqlı bir halqadan fərqlənir. “Stream” adına baxmayaraq, bu metod çağırışları hazırda sinxrondur.

# d3.geoStream(obyekt, axın) & lt & gt

Göstərilən GeoJSON-u axın edir obyekt göstərilən proyeksiyaya axın. Həm xüsusiyyətlər, həm də həndəsə obyektləri giriş olaraq dəstəklənsə də, axın interfeysi yalnız həndəsəni təsvir edir və beləliklə əlavə xüsusiyyət xüsusiyyətləri axınlara görünmür.

# axın.nöqtə(x, y[, z])

Müəyyən edilmiş koordinatlarla bir nöqtəni göstərir xy (və isteğe bağlı olaraq z). Koordinat sistemi dəqiqləşdirilməyib və tətbiqdən asılıdır, məsələn, proyeksiya axınları giriş olaraq dərəcə şəklində sferik koordinatları tələb edir. Çoxbucaqlı və ya xəttin kontekstindən kənarda bir nöqtə nöqtə həndəsə obyektini (Point və ya MultiPoint) göstərir. Bir xətt və ya çoxbucaqlı üzük içərisində nöqtə bir nəzarət nöqtəsini göstərir.

# axın.lineStart()

Bir xəttin və ya üzüyün başlanğıcını göstərir. Bir çoxbucaq içərisində, bir üzüyün başlanğıcını göstərir. Bir çoxbucaqlının ilk üzüyü xarici halqadır və ümumiyyətlə saat yönündədir. Hər hansı sonrakı üzüklər çoxbucaqdakı delikləri göstərir və ümumiyyətlə saat yönünün əksinədir.

Bir xəttin və ya üzüyün sonunu göstərir. Bir çoxbucaqlı içəridə, bir üzüyün sonunu göstərir. GeoJSON-dan fərqli olaraq, bir üzüyün lazımsız bağlanma koordinatıdır yox nöqtə ilə göstərilir və bunun əvəzinə bir poliqon daxilində lineEnd ilə nəzərdə tutulur. Beləliklə, verilən çoxbucaqlı giriş:

Axındakı aşağıdakı metod çağırışlarını istehsal edəcəkdir:

# axın.poliqon Başlayın()

Bir çoxbucağın başlanğıcını göstərir. Bir çoxbucaqlının ilk sətri xarici üzüyü, sonrakı sətirlər isə daxili delikləri göstərir.

# axın.poliqonEnd()

Bir çoxbucaqlının sonunu göstərir.

Kürəni göstərir (mərkəz kürəsi ⟨0,0,0⟩).

Transforms proqnozların ümumiləşdirilməsidir. Transform proqramı proyeksiya. axın və ötürülə bilər yol.proyeksiya. Bununla birlikdə, yalnız digər proyeksiya metodlarının bir alt hissəsini həyata keçirirlər və sferikdən müstəviyə koordinatlarına proyeksiya etmək əvəzinə ixtiyari həndəsi çevrilmələri təmsil edirlər.

# d3.geoTransform(metodlar) & lt & gt

Müəyyən edilmiş metodlardan istifadə edərək ixtiyari çevrilməni təyin edir metodlar obyekt. Hər hansı bir təyin olunmamış metod girişləri çıxış axınına yayan ötürmə metodlarından istifadə edəcəkdir. Məsələn, y-ölçü (həmçinin bax şəxsiyyət.reflectY):

Və ya afin matris çevrilməsini təyin etmək üçün:

Proqnozlar iki mərhələdə həndəsələrin kəsilməsini və ya kəsilməsini həyata keçirir.

Əvvəlcədən kəsmə coğrafi koordinatlarda baş verir. Antimeridian xətti boyunca kəsmək və ya kiçik bir dairə boyunca kəsmək ən ümumi strategiyadır.

Post-kəsmə düzbucaqlıda, bir proyeksiya düzbucaqlı kimi müəyyən bir həddə olduqda meydana gəlir.

Kırpma funksiyaları proyeksiya axınının çevrilməsi kimi həyata keçirilir. Əvvəlcədən kəsmə radian şəklində sferik koordinatlar üzərində işləyir. Kəsmə sonrası piksel şəklində planar koordinatlar üzərində işləyir.

# d3.geoClipAntimeridian

Antimeridian xəttini keçən həndəsələrin (xətlər və ya çoxbucaqlılar) hər tərəfdən ikiyə bölünməsi üçün bir axını dəyişdirən bir kəsmə funksiyası. Tipik olaraq əvvəlcədən kəsmə üçün istifadə olunur.

# d3.geoClipCircle(bucaq)

Həndəsələri kiçik bir radius dairəsi ilə məhdudlaşdıracaq şəkildə bir axını çevirən bir kəsmə funksiyası yaradır bucaq proyeksiya mərkəzinin ətrafında. Tipik olaraq əvvəlcədən kəsmə üçün istifadə olunur.

# d3.geoClipRectangle(x0, y0, x1, y1)

Həndəsələrin koordinatların düzbucaqlısı ilə məhdudlaşdığı bir axını çevirən bir qırpma funksiyası yaradır [[x0, y0], [x1, y1]]. Tipik olaraq kəsmə sonrası üçün istifadə olunur.


Effektiv Jenkins Plugins (1)

(Yeniləmə 2018-05-13: Budur bu yazının hind dilində tərcüməsi, Nikol @ DealsDaddy tərəfindən təqdim edilmişdir.)

İlk olaraq 2006-cı ildə “Hudson” olaraq təsis edilən Jenkins, proqram layihələrinin qurulması, yerləşdirilməsi və avtomatlaşdırılmasını dəstəkləyən aparıcı avtomatlaşdırma tətbiqetmələrindən biridir. Jenkins-in böyük bir üstünlüyü, Davamlı İnteqrasiya və Davamlı Çatdırılma prosesində lazımlı genişləndirilmiş xüsusiyyətlərə imkan verən yüzlərlə plaginin mövcudluğudur. Jenkins Plugins səhifəsini yeni yoxladığımda, beş kateqoriyaya bölünən 873 plagin var: Platformalar, İstifadəçi interfeysi, İdarəetmə, Mənbə kodu idarəetməsi və Quruluş idarəetməsi.

Jenkins plaginlərindən səmərəli istifadə edərək, Jenkins ilə təcrübənizi daha məhsuldar edir. Bəzən istifadə etdiyim və ya öyrəndiyim Jenkins plaginləri haqqında yazacağam. İlk yazı, keçən il (2015-dən 2016-a qədər) Davamlı Çatdırılma sisteminin qurulmasında işlədiyim zaman istifadə etdiyim bəzi plaginlərdən başlayacaq.


Başlayırıq

Misal Sandbox

Dərhal dalmaq və tək sənədli komponentlərlə oynamağa başlamaq istəyirsinizsə, CodeSandbox-da bu sadə todo tətbiqinə baxın.

JavaScript-də Modul Qurma Sistemləri Yeni İstifadəçilər üçün

.Vue komponentləri ilə inkişaf etmiş JavaScript tətbiqetmələrinin sahəsinə daxil oluruq. Bu, hələ etməmisinizsə, bir neçə əlavə vasitə istifadə etməyi öyrənmək deməkdir:

Düyün Paket Meneceri (NPM): Reyestrdən paketlərin alınmasına dair Başlanğıc təlimat bölümünü oxuyun.

ES2015 / 16 ilə müasir JavaScript: Babel’s Learn ES2015 təlimatını oxuyun. Hazırda hər bir xüsusiyyəti əzbərləməyinizə ehtiyac yoxdur, ancaq bu səhifəni geri qayıda biləcəyiniz bir istinad kimi saxlayın.

Bu qaynaqlara dalmaq üçün bir gün sərf etdikdən sonra, Vue CLI 3-ə baxmağı məsləhət görürük. Təlimatları izləyin və qısa müddət ərzində .vue komponentləri, ES2015, Webpack ilə isti bir şəkildə yenidən yüklənən bir Vue layihəniz olmalıdır!

Ətraflı istifadəçilər üçün

CLI sizin üçün alət konfiqurasiyalarının əksəriyyətinin qayğısına qalır, eyni zamanda öz konfiqurasiya seçimləri ilə incə toxumalı fərdiləşdirməyə imkan verir.

Öz qurma quraşdırmaınızı sıfırdan qurmağı üstün tutduğunuz halda, veb paketini vue-loader ilə əl ilə konfiqurasiya etməlisiniz. Veb paketin özü haqqında daha çox məlumat əldə etmək üçün rəsmi sənədlərə və Veb Paket Akademiyasına baxın.


Oradakı tırnaqlar (') qabığın kürə atmasına mane olur. * Sözün əsl mənasında mv əmrinə ötürülür, göstərilən qovluqlarda * adlı faylları tapmadığından uğursuz olur.

(Əgər boşluqları olan bir qovluq adınız varsa problemlərin qarşısını almaq üçün cüt təkliflər. * Sitatlar xaricində.)

Yenə də boş qovluqlar üçün səhvləri alacaqsınız. (Eyni səbəb: fayl nümunə üçün uyğunluq tapmazsa, nümunənin özünü əmrə arqument kimi ötürür.)

Kodunuzla bağlı bir neçə problem var:

Yeni sətirlərin simvolları olmadan ls-in nəticəsini $ siyahısına saxlayırsınız. ls yeni sətir işarələri ilə ayrılmış fayl adlarının siyahısını çıxarır. newline, fayl adındakı hər hansı bir qədər etibarlı bir xarakter daşıyır, nəticədə etibarlı bir şəkildə istifadə edilə bilməz. Məsələn, a və b olan bir qovluq üçün ls çıxışı, bir & ltnewline & gtb adlı bir fayl olan bir qovluqla eyni olur.

Bu əmrin uğursuz olduğunu yoxlamırsınız. Ümumiyyətlə, əmrlərin çıxış vəziyyətini yoxlamalısınız, amma bu, xüsusilə CD-yə aiddir, çünki qalan əmrlər o yeni qovluqda olduğunuzu güman edir və olmadığınız zaman bunun dramatik nəticələri ola bilər.

POSIX qabıqları $ PWD dəyişənindəki mövcud qovluğa (bir) yolu onsuz da saxlayır, buna görə də burada pwd istifadə etməyinizə ehtiyac yoxdur (xüsusən də ümumi halda, komanda əvəzləməsi arxada qalan satır simvollarını yoldan çıxaracaq). Ayrıca, mv nisbi yolları qəbul edir, beləliklə mütləq yol qurmağınıza ehtiyac yoxdur.

Dəyişəndən sitat gətirməmək split + glob kabuklarda operator. Yəni dəyişənin məzmunu bölünür (boşluq olanlar üçün xüsusi qaydalarla $ IFS-də göstərilən ayırıcılarda) və bölünmənin nəticəsi olan hər element joker simvol axtarılır, buna görə uyğun faylların siyahısına qədər genişləndirilə bilər. .

Budur, bölünməsini istəyirsən, ancaq yalnız yeni xətt simvollarında və globbing istəmirsən, buna görə deaktiv etməlisən:

Yenə də, bir dəyişəni sitat gətirməmək split + glob operator. Budur, heç nə istəmirsiniz, ona görə də bu dəyişənlərdən sitat gətirməlisiniz.

Artıq qeyd edildiyi kimi, joker işarələr yalnız sitat qoyulmadıqda genişləndirilir, buna görə * tırnakların arasından çıxarmalısınız. Daha əvvəl -f seti ilə globbing funksiyasını ləğv etdinizsə, bu əmri çağırmazdan əvvəl set + f ilə bərpa etməlisiniz.


Reaksiya verin

Reaktiv interaktiv interfeyslər yaratmağı ağrısız edir. Tətbiqinizdəki hər vəziyyət üçün sadə görünüşlər dizayn edin və React, məlumatlarınız dəyişdikdə səmərəli şəkildə yenilənəcək və yalnız lazımi komponentləri göstərəcəkdir.

Deklarativ baxışlar kodunuzu daha proqnozlaşdırıla bilən və daha asan həll etmək imkanı yaradır.

Komponent əsaslı

Öz vəziyyətlərini idarə edən kapsüllənmiş komponentlər yaradın, sonra onları mürəkkəb istifadəçi interfeysləri üçün hazırlayın.

Komponent məntiqi şablon yerinə JavaScript-də yazıldığından zəngin məlumatları tətbiqinizdən asanlıqla keçirə və vəziyyəti DOM-dan kənarda saxlaya bilərsiniz.

Bir dəfə öyrənin, hər yerə yazın

Texnoloji yığınınızın qalan hissəsi ilə bağlı fərziyyələr irəli sürmürük, beləliklə mövcud kodu yenidən yazmadan React-da yeni xüsusiyyətlər inkişaf etdirə bilərsiniz.

React həmçinin Node istifadə edərək serverdə işləyə bilər və React Native istifadə edərək mobil tətbiqləri gücləndirir.

Sadə bir komponent

Reakt komponentləri giriş məlumatlarını alan və göstərilənləri qaytaran bir göstərmə () metodunu tətbiq edirlər. Bu nümunədə JSX adlı XML-ə oxşar sintaksis istifadə olunur. Komponentə ötürülən giriş məlumatlarına this.props vasitəsi ilə render () yolu ilə daxil olmaq mümkündür.

JSX isteğe bağlıdır və React istifadə etməsi tələb olunmur. JSX tərtib addımının hazırladığı xam JavaScript kodunu görmək üçün Babel REPL-i sınayın.

Kod nümunəsi yüklənir.

Vəziyyətli bir komponent

Giriş məlumatlarının alınmasına əlavə olaraq (this.props vasitəsilə əldə olunur), bir komponent daxili vəziyyət məlumatlarını saxlaya bilər (this.state vasitəsilə əldə edilir). Komponentin dövlət məlumatları dəyişdikdə, göstərilən işarələmə render () yenidən çağırılaraq yenilənəcəkdir.

Kod nümunəsi yüklənir.

Ərizə

Rekvizit və vəziyyətdən istifadə edərək kiçik bir Todo tətbiqetmə düzəldə bilərik. Bu misal istifadəçinin daxil etdiyi mətni və cari siyahını izləmək üçün vəziyyətdən istifadə edir. Tədbir idarəediciləri satırda göstərildiyi kimi görünsə də, tədbir nümayəndə heyəti istifadə edilərək toplanacaq və həyata keçiriləcəkdir.

Kod nümunəsi yüklənir.

Xarici Plugins istifadə bir komponent

Reakt digər kitabxanalar və çərçivələr ilə əlaqə yaratmağa imkan verir. Bu misal istifadə edir əlamətdar& lttextarea & gt dəyərini real vaxtda çevirmək üçün xarici Markdown kitabxanası.


D3.js geoJSON sənədimi göstərə bilmir - Coğrafi İnformasiya Sistemləri

Bu sənəd yalnız böyük dəyişiklikləri əhatə edir. Kiçik və yamaq dəyişiklikləri üçün buraxılış qeydlərinə baxın.

D3 artıq təmiz ES modulları kimi göndərilir və Node.js 12 və ya daha yüksək versiyaya ehtiyac duyur. Daha çox məlumat üçün Zəhmət olmasa Sindre Sorhus'un suallarını oxuyun.

d3.bin indi boşluqlara məhəl qoymur. d3.alma və d3.düşmə artıq sıfırın müqayisə edilə biləcəyini hesab etmir.

Sadə tərəzi, indi Domain Domain dəyərləri üçün InternMap istifadə edir, indi vasitəsilə primitiv bir dəyər tətbiq edərək uniqued olunur. obyekt.valueOf əvəzinə bir simli məcbur etmək əvəzinə obyekt.toString.

Dizi bəyənir (məs.kimi canlı NodeList element.childNodes) d3.selectAll və. dizilərinə çevrilir seçim.hamısını seç.

İndi D3 yerli kolleksiyalardan istifadə edir (Xəritə və Set) və təkrarlananları qəbul edir. d3.group və d3.rollup, d3.nest-i əvəz edən və d3-iyerarxiya və d3-seçimlə çox işləyən güclü yeni toplama funksiyalarıdır. D3-array-da d3.greatest, d3.quickselect və d3.fsum kimi bir çox yeni köməkçi var.

İndi D3 hadisələri birbaşa dinləyicilərə ötürür, d3.event qlobalını əvəz etmək və D3 vanil JavaScript və digər bir çox çərçivə ilə gətirmək.

d3-delaunay (Vladimir Agafonkinin əla Delaunatoru əsasında), performans, möhkəmlik və axtarışda dramatik inkişaflar təklif edən d3-voronoi əvəz edir. Və kürə (coğrafi) məlumatlar üçün yeni bir d3-geo-voronoi var! d3-təsadüfi böyük ölçüdə genişlənir və toxuma təsadüfilik üçün sürətli bir xətti uyğunlaşdırıcı generator daxildir. d3-akkord yönəldilmiş və köçürülmüş akkord diaqramları üçün yeni düzənlərə malikdir. d3 miqyaslı yeni radial miqyaslı bir növ əlavə edir.

... və digər kiçik aksesuarların bir sıra. 450-dən çox nümunə D3 6.0-a yeniləndi!

  • Təkrarlananları qəbul edin.
  • D3.group əlavə edin.
  • D3.grupları əlavə edin.
  • D3.index əlavə edin.
  • D3.indeks əlavə edin.
  • D3.rollup əlavə edin.
  • D3.rollups əlavə edin.
  • D3.maxIndex əlavə edin.
  • D3.minIndex əlavə edin.
  • D3.greatest əlavə edin.
  • D3.greatestIndex əlavə edin.
  • D3.least əlavə edin.
  • D3.leastIndex əlavə edin.
  • D3.bin əlavə edin.
  • D3.count əlavə edin.
  • D3.cumsum əlavə edin.
  • D3.fsum əlavə edin.
  • D3.Adder əlavə edin.
  • D3.quantileSorted əlavə edin.
  • D3.quickselect əlavə edin.
  • Əlavə et bisektor.Mərkəz.
  • D3.cross üçün ikidən çox təkrarlanmağa icazə verin.
  • D3.quantile ilə sıralanmamış girişləri qəbul edin.
  • A massiv.Safari-də sıralama xətası.
  • NaN girişinə məhəl qoymamaq üçün qutu eşiklərini düzəldin.
  • Domen xaricində gənələri qaytarmamaq üçün d3.ticks düzəldin.
  • D3.medianın fəaliyyətini yaxşılaşdırın.
  • Əlavə et hadisə.mode.
  • Dəyişdirin fırça. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Multitouch (iki toxunuşla) qarşılıqlı əlaqəni inkişaf etdirin.
  • Əlavə et təkrarlamalar arqument simulyasiya. gənə.
  • Əlavə et forceCenter.güc.
  • Əlavə et güc Simulyasiya.randomSource.
  • Bütün quraşdırılmış qüvvələr indi tamamilə deterministikdir (“titrəyən” təsadüfən qovşaqlar daxil olmaqla).
  • Varsayılan fillotaksis planını bir yarım radius ilə əvəzləşdirərək bir qədər yaxşılaşdırın.
  • Bir keçid naməlum bir düyünə istinad edərkən səhv mesajını yaxşılaşdırın. indi təsadüfi bir mənbədən ötürülür.
  • Düyünləri sabit mövqelərlə işə salarkən səhvləri düzəldin.
  • Defolt mənfi işarəsini tire-minus (-) əvəzinə mənfi işarəyə (-) dəyişdirin.
  • 1e21-dən böyük və ya bərabər olan ədədlərin ond d formatını düzəldin.
  • Təkrarlananları qəbul edin.
  • Əlavə et düyün[Symbol.iterator] hiyerarşileri indi təkrarlanır.
  • Əlavə et düyün.təhsil edin.
  • Dəyişdirin düyün.keçmə indeksini keçmək üçün hər biri.
  • Dəyişdirin düyün.hər kəsişmə indeksini keçdikdən sonra.
  • Dəyişdirin düyün.hər kəsişmə indeksini keçməmişdən əvvəl.
  • D3.packSiblings-i böyük dairələr üçün düzəldin.
  • D3.treemapBinary-də sıfıra bölmə səhvini düzəldin.
  • D3.treemapResquarify-da sıfıra bölmə səhvini düzəldin.
  • Əlavə et interpolateZoom.rho. (# 25)
  • D3.piecewise-in standart olaraq d3.interpolate istifadə etməsinə icazə verin. # 90
  • DOMMatrix istifadə etmək və mütləq vahidlər tələb etmək üçün d3.interpolateTransformCss dəyişdirin. # 83
  • D3.randomLcg əlavə edin.
  • D3.randomGamma əlavə edin.
  • D3.randomBeta əlavə edin.
  • D3.randomWeibull əlavə edin.
  • D3.randomCauchy əlavə edin.
  • D3.randomLogistic əlavə edin.
  • D3.randomPoisson əlavə edin.
  • D3.randomInt əlavə edin.
  • D3.randomBinomial əlavə edin.
  • D3.randomGeometric əlavə edin.
  • D3.randomPareto əlavə edin.
  • D3.randomBernoulli əlavə edin.
  • D3.randomBates-in kəsrli olmasına icazə verin n.
  • D3.randomIrwinHall-ın kəsrli qəbul etməsinə icazə verin n.
  • Math.random-u standart mənbəyə bağlamayın.

Töhfələriniz üçün @Lange, @ p-v-d-Veeken, @svanschooten, @ Parcly-Taxel və @jrus'a təşəkkür edirik!

  • Təkrarlananları qəbul edin.
  • Əlavə et ayrılmaq.rangeRound.
  • Əlavə et ardıcıl.range (d3 oxu ilə uyğunluq üçün).
  • Əlavə et ardıcıl.rangeRound.
  • Əlavə et ardıcıl Quantile.quantiles.
  • D3.scaleRadial əlavə edin. indi interpolatoru təyin etmək üçün istifadə edilə bilər. indi interpolatoru təyin etmək üçün istifadə edilə bilər. artıq interpolatorun yerinə bir sıra massivi qəbul edə bilər. artıq interpolatorun yerinə bir sıra massivi qəbul edə bilər.
  • Düzəldin davamlı.gözlənmiş domenlərin həmişə gənələri əhatə etməsini təmin etmək.
  • Düzəldin giriş.kiçik etki sahələri.
  • Düzəldin giriş.kiçik etki sahələri. # 44
  • Düzəldin miqyaslı. ardıcıl kvant tərəziləri üçün qısqac. Təşəkkürlər, @ Fil!
  • Düzəldin miqyaslı. aralıq dəyərlərindən daha çox domen dəyəri olan davamlı tərəzilər üçün qısqac.
  • Ayrılan tərəziləri azalan domenlərlə düzəldin.
  • İstifadədən silin addım arqument vaxt.tiklər və vaxt.cox.
  • Əlavə et seçim.selectChild.
  • Əlavə et seçim.seçməkUşaqlar.
  • D3.pointer əlavə edin.
  • D3.pointers əlavə edin.
  • Əlavə et seçim[Symbol.iterator] seçimləri artıq təkrarlanır!
  • İlə təkrarlananları qəbul edin seçim.data.
  • D3.selectAll ilə təkrarlananları qəbul edin.
  • Dəyişdirin seçim. keçmək üçün hadisə birbaşa dinləyicilərə.
  • İndeksi və qrupu silin seçim.dünya!
  • D3.event çıxarın!
  • D3.mouse çıxarın.
  • D3.touch silin.
  • D3 toxunuşlarını silin.
  • D3.customEvent silin.
  • D3.clientPoint silin.
  • D3.sourceEvent silin.
  • Düzəldin seçim.merge (keçid) səhv etmək.
  • Təkrarlananları qəbul edin.
  • D3.line əlavə edin (x, y) stenoqrafiya.
  • D3.area əlavə edin (x, y0, y1) stenoqrafiya.
  • D3.symbol əlavə edin (növü, ölçüsü) stenoqrafiya.
  • Əlavə et keçid.reaseVariing.
  • Əlavə et keçid[Symbol.iterator] keçidləri artıq təkrarlanır.
  • Düzəldin seçim.hərəsə keçid, adı verilən mirasa keçid tapılmırsa.k
  • Düzəldin keçid. seçim boşdursa dərhal həll edin.
  • Əlavə et böyüdün.tap məsafəsi.
  • Dəyişdirin böyüdün. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Varsayılanı dəyişdirin böyüdün.görmək üçün süzgəc təkər nəzarət düyməsinə basıldığı təqdirdə hadisələr.
  • Varsayılanı dəyişdirin böyüdün.wheelDelta, nəzarət düyməsinə basıldıqda daha sürətli getmək.
  • Toxunma əməliyyatı qurmayın: yoxdur.
  • D3 seçiminə keçin 2.

D3 6.0 geriyə uyğun olmayan bir neçə dəyişiklik təqdim edir.

  • D3.event çıxarın.
  • Dəyişdirin seçim. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Dəyişdirin keçid. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Dəyişdirin fırça. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Dəyişdirin sürükləyin. keçmək üçün hadisə birbaşa dinləyicilərə.
  • Dəyişdirin böyüdün. keçmək üçün hadisə birbaşa dinləyicilərə.
  • D3.mouse istifadə d3.pointer sil.
  • D3.touch istifadə edin d3.pointer istifadə edin.
  • D3.touches istifadə edin d3.pointers istifadə edin.
  • D3.clientPoint istifadə d3.pointer istifadə silin.
  • D3.voronoi d3.Delaunay istifadə edin.
  • D3.nest istifadə d3.group və d3.rollup istifadə silin.
  • D3.map istifadə xəritəsini silin.
  • D3.set istifadə Set sil.
  • D3.keys çıxarın Object.keys istifadə edin.
  • D3.values-i çıxarın Object.values ​​istifadə edin.
  • D3.entries çıxarın Object.entries istifadə edin.
  • D3.histogramın adını d3.bin olaraq dəyişdirin.
  • D3.scan adını d3.leastIndex olaraq dəyişdirin.
  • D3.interpolateTransformCss-i mütləq vahidlər tələb etmək üçün dəyişdirin.
  • Mənfi dəyərlər üçün defis-mənfi əvəzinə mənfi işarəyə d3.formatı dəyişdirin.

İndi D3 üçün ES2015-i dəstəkləyən bir brauzer tələb olunur. Köhnə brauzerlər üçün öz transpillerinizi gətirməlisiniz.

Nəhayət, Bower-a dəstək azaldıldı D3 indi yalnız npm və GitHub-da yayımlandı.

Yüksəltməyə kömək üçün miqrasiya təlimatımıza baxın.

D3 5.0 yalnız geriyə uyğun olmayan bir neçə dəyişiklik təqdim edir.

Artıq D3 məlumat yükləmək üçün asenkron zənglər əvəzinə Promises istifadə edir. Vədlər asinxron kodun quruluşunu sadələşdirir, xüsusən də async-i dəstəkləyən və gözləyən müasir brauzerlərdə. (Observable-dəki vədlərə dair bu girişə baxın.) Məsələn, v4-də bir CSV faylı yükləmək üçün belə deyə bilərsiniz:

Xətanı yenidən düzəltməyə ehtiyacınız olmadığına diqqət yetirin; söz avtomatik olaraq rədd ediləcək və edə bilərsiniz söz ver. istəsəniz tutun. Await istifadə edərək kod daha asandır:

Vədlərin qəbul edilməsi ilə D3 artıq XMLHttpRequest əvəzinə Fetch API istifadə edir: d3-sorğu modulu d3-fetch ilə əvəz edilmişdir. Fetch axın cavabları kimi bir çox güclü yeni xüsusiyyətləri dəstəkləyir. D3 5.0, d3-sıra modulunu da ləğv edir və silir. Paralel olaraq asinxron tapşırıqlar toplusunu işə salmaq üçün Promise.all və ya paralelliyi idarə etmək üçün p-növbə kimi köməkçi kitabxanadan istifadə edin.

D3 artıq d3.schemeCategory20 * kategorik rəng sxemləri təqdim etmir. Bu iyirmi rəng sxemləri səhv idi, çünki qruplaşdırılmış dizaynı məlumatdakı əlaqələri yalnış şəkildə göstərə bilər: paylaşılan bir rəng, kodlanmış məlumatların bir qrupun (super-kateqoriya) bir hissəsi olduğunu, nisbi yüngüllük isə nizam mənasını verə biləcəyini göstərə bilər. Bunun əvəzinə, D3 artıq ColorBrewer-dən mükəmməl sxemlər tətbiq edən d3 miqyaslı-xromatik daxildir, bunlar arasında kategorik, fərqli, ardıcıl tək rəngli və ardıcıl çox rəngli sxemlər də var. Bu sxemlər həm ayrı, həm də davamlı variantlarda mövcuddur.

D3 indi yürüş meydanlarının tətbiqini və d3 konturu ilə sıxlığın qiymətləndirilməsini təmin edir! İki yeni d3 seçim metodu var: seçimseçilmiş qovşaqların klonlarını daxil etmək üçün .clone və d3. ayrı elementlər yaratmaq üçün yaradın. Coğrafi proqnozlar artıq dəstəklənir proyeksiya. Philippe Rivière'nin bir neçə fantastik yeni çoxyüzlü proqnozlarını təmin edən.

Nəhayət, D3’s package.json artıq asılı D3 modullarının dəqiq versiyalarını sancmır. Bu, D3 modullarının təkrar quraşdırılmasında bir problemi həll edir.

D3 4.0 moduldur. Bir kitabxana əvəzinə, D3 indi birlikdə işləmək üçün hazırlanmış bir çox kiçik kitabxanadır. İstədiyiniz hissədən istifadə edəcəyiniz hissələri seçib seçə bilərsiniz. Hər kitabxana mərkəzləşdirilməmiş mülkiyyət və müstəqil buraxılış dövrlərinə imkan verən öz anbarında saxlanılır. Varsayılan paket bu mikrokitabların təxminən otuzunu birləşdirir.

Əvvəlki kimi, ColorBrewer tərəziləri kimi isteğe bağlı plaginləri standart paketin üstünə yükləyə bilərsiniz:

Varsayılan paketdən istifadə etməyiniz tələb olunmur! Yalnız d3 seçimindən istifadə edirsinizsə, onu müstəqil kitabxana kimi istifadə edin. Varsayılan paket kimi, vanil skript etiketi və ya RequireJS (HTTP / 2 üçün əladır!) İstifadə edərək D3 mikro kitabxanalarını yükləyə bilərsiniz:

Ayrıca D3 mikro kitabxanaları xüsusi bir paketə daxil edə bilərsiniz və ya optimallaşdırılmış paketlər yaratmaq üçün Webpack və Toplama kimi vasitələrdən istifadə edə bilərsiniz. Xüsusi paketlər, məsələn, D3’ün bir alt dəstini istifadə edən tətbiqetmələr üçün əladır, məsələn React chart kitabxanası tərəzilər və formalar üçün D3 istifadə edə bilər və DOM-u idarə etmək üçün React. D3 mikrokitablar ES6 modulları kimi yazılmışdır və toplama, daha kiçik paketlər istehsal etmək üçün simvol səviyyəsində seçməyinizə imkan verir.

Kiçik sənədlər gözəldir, lakin modulluq D3-ü daha da artırmaqla bağlıdır əyləncəli. Mikro kitabxanaları anlamaq, inkişaf etdirmək və test etmək daha asandır. Yeni insanların işə qarışmalarını və töhfə vermələrini asanlaşdırırlar. Bir "əsas modul" və "plagin" arasındakı fərqi azaldır və D3 xüsusiyyətlərində inkişaf sürətini artırırlar.

Modulluqla maraqlanmırsınızsa, əsasən bu dəyişikliyi görməzdən gələ və standart paketdən istifadə etməyə davam edə bilərsiniz. Bununla birlikdə, ES6 modullarının qəbul edilməsinin qaçılmaz bir nəticəsi var: D3 4.0-dakı hər bir simvol indi D3 3.x-in iç içə yerləşdiyi yerdən daha düz bir ad sahəsi paylaşır. Məsələn, d3.scale.linear indi d3.scaleLinear, d3.layout.treemap isə indi d3.treemap. ES6 modullarının qəbulu eyni zamanda D3-ün artıq ciddi rejimdə yazıldığını və daha yaxşı oxunuşlu olduğunu göstərir. Və D3’ün xüsusiyyətlərində bir çox başqa əhəmiyyətli inkişaf var! (D3 3.x kodunun demək olar ki hamısı yenidən yazılmışdır.) Bu dəyişikliklər aşağıda verilmişdir.

Varsayılan UMD paketi indi anonimdir. AMD və ya CommonJS aşkar edilərsə, heç bir d3 qlobal ixrac edilmir. Vanil bir mühitdə, D3 mikro kitabxanaları d3 qlobal bölüşdürür, hətta onları müstəqil olaraq yükləsəniz də, yazdığınız kod, standart paketdən istifadə edib etməməyinizlə eynidir. (Daha çox məlumat üçün bir (D3) Plugin edək.) Yaradılan paket artıq Git deposunda saxlanılmır Bower, d3-bower-a dəyişdirilib və yaradılan sənədləri npm-də tapa bilərsiniz və ya son versiyaya əlavə edə bilərsiniz. Minikləşdirilməmiş standart paket artıq manqurtlaşdırılmır, daha oxunaqlı və satır içi şərhləri qoruyur.

Bəzi istifadəçilərin təəccübünə görə, 3.x riyazi əməliyyatların qısa şəkildə təqdim olunması üçün λ, φ, τ və π kimi Unicode dəyişən adlarını istifadə etdi. Bu yanaşmanın bir mənfi tərəfi, UTF-8 əvəzinə ISO-8859-1 istifadə edərək minikləşdirilməmiş D3 yükləsəniz, SyntaxError-un baş verəcəyi idi. 3.x ayrıca 1e-6 üçün SI prefiksi µ kimi Unicode simli ədəbiyyatını istifadə etdi. 4.0 kodlaşdırma problemlərindən yayınaraq yalnız ASCII dəyişən adları və ASCII simli ədəbiyyatını istifadə edir (bax toplama-plugin-ascii).

Yeni d3.scan metodu, müəyyən bir müqayisəyə görə ən az elementin indeksini qaytararaq bir sıra xətti taramasını həyata keçirir. Bu, d3.min və d3.max-a bənzəyir, ancaq həddindən artıq dəyəri hesablamaqdansa, həddindən artıq elementin yerini tapmaq üçün istifadə edə bilərsiniz.

Yeni d3.ticks və d3.tickStep metodları insan tərəfindən oxunaqlı ədədi gənələr yaratmaq üçün faydalıdır. Bu metodlar aşağı səviyyəli bir alternativdir davamlı.d3 miqyaslı nöqtələr. Yeni tətbiq nisbi səhvlə ölçülən optimal gənə sayını qaytararaq daha dəqiqdir.

D3.range metodu artıq üzən nöqtə səhvindən qaçınmaq üçün ətraflı bir cəhd göstərmir addım bir tam deyil. Qaytarılan dəyərlər qəti olaraq müəyyən edilir başlamaq + mən * addım, harada mən bir tamdır. (Üzən nöqtə riyaziyyatı haqqında daha çox məlumat əldə edin.) D3.range bir səhv atmaqdansa, sonsuz aralıqlar üçün boş massivi qaytarır.

Könüllü girişçilər üçün metod imzası kimi sıra metodları ilə daha uyğun olmaq üçün dəyişdirilmişdir massiv.forEach: accessor cari element ötürülür (d), indeks (mən) və sıra (məlumat) ilə bu kimi təyin olunmamışdır. Bu, d3.min, d3.max, d3.extent, d3.sum, d3.mean, d3.median, d3.quantile, d3.variance və d3.deviation təsir göstərir. D3.quantile metodu əvvəllər bir accessor almadı. Könüllü arqumentlərlə bəzi metodlar indi arqumentləri qəti şəkildə yoxlamaqdansa, boş və ya təyin olunmamış olduqda bu arqumentləri itkin kimi qəbul edir.

Yeni d3.histogram API, d3.layout.histogram əvəz edir. Açıqlamaqdansa zibil qabı.x və zibil qabıHər qaytarılmış qutuda .dx, histogram ifşa olunur zibil qabı.x0 və zibil qabı.x1, buna zəmanət verir zibil qabı.x0 tam olaraq bərabərdir zibil qabı.x1 əvvəlki qutuda. "Tezlik" və "ehtimal" rejimləri artıq dəstəklənmir, hər zibil giriş məlumatlarından sadəcə bir sıra elementlərdir. zibil qabı. uzunluq D3 3.x’-ə bərabərdir zibil qabı.y tezlik rejimində. Bir ehtimal paylanmasını hesablamaq üçün hər zibildəki elementlərin sayını ümumi elementlərin sayına bölün.

The histoqram.range metodu dəyişdirildi histoqram. tərəzi ilə tutarlılıq üçün etki. The histoqram.bins metodunun adı dəyişdirildi histoqram.thresholds və artıq yuxarı dəyəri qəbul etmir: n eşiklər çıxaracaq n + 1 qutu. Eşiklər əvəzinə istədiyiniz sayda qutu təyin etsəniz, d3.histogram artıq gözəl qutu ərəfələrini hesablamaq üçün d3.ticks istifadə edir. Varsayılan Sturges ’düsturuna əlavə olaraq D3 ​​indi Freedman-Diaconis qaydasını və Scottun normal istinad qaydasını tətbiq edir.

D3 3.x-də baltaları düzgün şəkildə göstərmək üçün onları tərtib etməlisiniz:

Etmədinizsə, bunu gördünüz:

D3 4.0 standart stillər və daha qısa sintaksis təmin edir. D3.svg.axis və ox.orient, D3 4.0 artık hər istiqamət üçün dörd qurucu təmin edir: d3.axisTop, d3.axisRight, d3.axisBottom, d3.axisLeft. Bu konstruktorlar bir tərəzi qəbul edirlər, beləliklə yuxarıdakıların hamısını aşağı salmaq olar:

Əvvəlki kimi, stil cədvəlləri tətbiq edərək və ya ox elementlərini dəyişdirərək ox görünüşünü fərdiləşdirə bilərsiniz. Varsayılan görünüş oxu yarım piksellə əvəzləmək üçün bir qədər dəyişdirilib, bu, Safari-də oxun iki piksel qalınlığında çəkiləcəyi xırtıldayan göstərmə problemini düzəldir.

İndi var ox.tickArguments metodu, alternativ olaraq ox. ox işarəsi arqumentlərinin yoxlanılmasına imkan verən nöqtələr. The ox.tickSize metodu gənə ölçüsünü təyin edərkən yalnız bir arqumentə icazə vermək üçün dəyişdirilmişdir. The ox.innerTickSize və ox.outerTickSize metodlarının adı dəyişdirildi ox.tickSizeInner və ox.tickSizeOuter, sırasıyla.

D3.svg. fırçasını dəyişdirərək, indi boyunca fırçalamaq üçün üç sinif fırça var x-ölçü, y-ölçü və ya hər ikisi: d3.brushX, d3.brushY, d3.brush. Fırçalar artıq tərəzidən asılı deyil, hər fırça ekran koordinatlarında bir seçim təyin edir. Müvafiq məlumat domenini hesablamaq istəyirsinizsə, bu seçim tərsinə çevrilə bilər. Fırçalana bilən sahəni təyin etmək üçün tərəzi aralığına etibar etmək əvəzinə, a fırça.təkləşdirmək üçün mövcud metod. Fırça ölçüsünü təyin etməsəniz, sahibin SVG elementinin tam həcminə görə borcludur. The fırça.clamp metodu da aradan qaldırıldı fırçalama daima fırça dərəcəsi ilə təyin olunan fırçalana bilən sahə ilə məhdudlaşır.

Fırçalar artıq aktiv fırça seçimini saxlamır (yəni, vurgulanan bölgə fırçanın mövqeyi) daxili olaraq. Fırçanın mövqeyi artıq fırçanın tətbiq olunduğu bütün elementlərdə saxlanılır. Fırçanın mövqeyi aşağıdakı kimi mövcuddur hadisə. bir fırça hadisəsi içərisində seçim və ya verilmiş bir d3.brushSelection çağıraraq element. Fırçanı proqramlı şəkildə hərəkət etdirmək üçün istifadə edin fırça. verilmiş bir seçim və ya keçid ilə hərəkət edin. fırçanın vurma nümunəsinə baxın. The fırça.event metodu silindi.

Fırça qarşılıqlı əlaqəsi yaxşılaşdırıldı. Varsayılan olaraq, fırçalar indi bu davranışı istifadə edərək dəyişə biləcəyiniz kontekst menyusu üçün nəzərdə tutulmuş sağ vuruşları görməməzliyə vurur fırça.filtre. Fırçalar iOS-da səciyyələnmiş siçan hadisələrini də görməzdən gəlir. Fırçalayarkən SHIFT (⇧) düyməsini basıb saxlayın x- ya y- fırçanın yeri. Tıklayıp sürükləyərkən META (⌘) düyməsini basıb saxlamaq, mövcud seçimi tərcümə etmək əvəzinə yeni bir seçimə başlayır.

Fırçanın standart görünüşü də təkmilləşdirilmiş və bir qədər sadələşdirilmişdir. Əvvəllər fırçaya makul bir görünüş vermək üçün üslub tətbiq etmək lazım idi, məsələn:

Fırça görünüşünü fərdiləşdirmək istəyirsinizsə, bu üslublar artıq atribut olaraq tətbiq olunur, xarici üslubları tətbiq edə və ya fırça elementlərini dəyişdirə bilərsiniz. (D3 4.0 oxlara bənzər bir inkişafa malikdir.) Yeni fırça.handleSize metodu, standart olaraq altı pikseli olan fırça sapı ölçüsünü ləğv etməyə imkan verir.

Fırça artıq idarə olunan hadisələri istehlak edir və sürükləmə və böyüdmə kimi digər interaktiv davranışlarla birləşməyi asanlaşdırır. The brushstartbrushend hadisələrin adı dəyişdirildi başlamaqsonsırasıyla. Fırça hadisəsi artıq bir hesabat vermir hadisə. fırçanın ölçüsünü dəyişdirməklə sürükləmək arasında fərq qoyma rejimi.

Böyük ad sahəsinin düzəldilməsinə görə:

İlə uyğunluq üçün qövs.padAngle, akkord.pastinq də dəyişdirildi lent.padAngle. Yeni lent.context metodu sizə Canvas-a akkord diaqramları göstərməyə imkan verir! D3 yoluna da baxın.

D3.set konstruktoru artıq surəti çıxarmaq üçün mövcud dəsti qəbul edir. D3.set-ə bir sıra ötürsəniz, dəyər əldəedicisini də keçə bilərsiniz. Bu giriş standart arqumentləri alır: cari element (d), indeks (mən) və sıra (məlumat) ilə bu tərifsiz. Misal üçün:

D3.map konstruktoru da standart massivə daxiletmə arqumenti nümunəsini izləyir.

The xəritə.hər biri və dəsti.hər metodun adı dəyişdirildi xəritə.hər biri və dəsti. hər biri müvafiq olaraq. Üçün arqumentlərin sırası xəritə.Hər biri də dəyişdirilib dəyər, açarxəritəüçün arqumentlərin sırası dəsti.Hər biri indi dəyər, dəyərdəsti. Bu, ES6-ya daha yaxındır xəritə.hər biri və dəsti.Hər biri üçün. ES6 Map və Set kimi, xəritə.set və dəsti.Add artıq metod zəncirini asanlaşdırmaq üçün cari kolleksiyanı (əlavə dəyər əvəzinə) qaytarın. Yeni xəritə.clear və dəsti.Kolleksiyaları boşaltmaq üçün aydın metodlardan istifadə edilə bilər.

The yuva.map metodu artıq həmişə bir d3.map nümunəsini qaytarır. Düz bir obyekt üçün istifadə edin yuva. əvəzinə obyekt. İlə birlikdə istifadə edildikdə yuva. qeydiyyatdan keçmək, yuva. girişlər indi qayıdır əvəzinə yarpaq girişləri üçün obyektlər . Bu edir yuva. bu Nest Treemap nümunəsində olduğu kimi hiyerarşilərlə birlikdə istifadə etmək daha asan.

Bütün rənglər artıq şəffaflığa məruz qalır rəng.opasite, bu [0, 1] dəki bir rəqəmdir. D3.rgb, d3.hsl, d3.lab, d3.hcl və ya d3.cubehelix rəng sahəsi qurucularına isteğe bağlı bir qeyri-şəffaflıq arqumenti keçə bilərsiniz.

İndi d3.color istifadə edərək rgba (…) və hsla (…) CSS rəng göstəricilərini və ya “şəffaf” simli təhlil edə bilərsiniz. "Şəffaf" rəng, sıfır qeyri-şəffaflıq və təyin olunmayan qırmızı, yaşıl və mavi kanalları olan bir RGB rəngi olaraq təyin edilir, bu onu şəffaf qara kimi təyin edən CSS-dən bir qədər fərqlənir, lakin başlanğıc və ya bitən rəngin olduğu rəng interpolasiya məntiqini sadələşdirmək üçün faydalıdır. təyin olunmamış kanallar. The rəng.toString metodu da eyni şəkildə CSS hesablanmış dəyərlərlə onaltılıq RGB formatı deyil, tam kanal dəyərləri olan bir rgb (…) və ya rgba (...) simli qaytarır. Bu, elementin başlanğıc stili son stilinə uyğun gəldiyi zaman qısa qapanma keçidləri ilə performansı artırır.

Yeni d3.color metodu rəngləri təhlil etmək üçün əsas metoddur: müvafiq rəng boşluğunda bir d3.color nümunəsini qaytarır və ya CSS rəng göstəricisi etibarsız olduqda sıfırdır. Misal üçün:

Ayrıştırma tətbiqi indi daha güclüdür. Məsələn, artıq rgb (...) içindəki tam ədədləri və faizləri qarışdıra bilməzsiniz və boşluq, onluq nöqtələr, rəqəm işarələri və digər kənar halları düzgün idarə edir. D3.rgb, d3.hsl, d3.lab, d3.hcl və d3.cubehelix rəng məkanının konstruktorları hər zaman daxil olan rəngin müvafiq rəng sahəsinə çevrilmiş surətini qaytarırlar. Halbuki rəng.rgb qalır, rgb.hsl rengi RGB rəng boşluğuna çevirmək üçün d3.hsl istifadə ilə silindi.

RGB rəng sahəsi, rəng yaratarkən kanal dəyərlərini hərisliklə ölçmür və sıxışdırmır, rəng sahəsi çevrilməsində dəqiqliyi artırır. Artıq miqdar və sıxılma meydana gəlir rəngGöstərmək üçün bir rəng formatlaşdırarkən .toString. Yenisini istifadə edə bilərsiniz rəng. bir rəngin gamutdan kənar olub olmadığını yoxlamaq üçün göstərilə bilər.

The rgb.parlaq metod artıq xüsusi hallar qara deyil. Bu, yeni bir rəng təyin edən bir vurma operatorudur r′, g′, b′ Harada r′ = r × güc(0.7, k), g′ = g × güc(0.7, k) və b′ = b × güc(0.7, k) daha parlaq qara hələ də qaradır.

Dave Green’in rəng sxemini ümumiləşdirən yeni bir d3.cubehelix rəng sahəsi var! (D3-miqyaslı d3.interpolateCubehelixDefault-a da baxın.) Öz xüsusi rəng boşluqlarınızı təyin etməyə davam edə bilərsiniz, həmçinin d3-hsv nümunəsinə baxın.

Bəzəməkdənsə göndərmək hər hadisə növü ilə obyekt, göndərmə obyekti artıq ümumi olaraq ortaya qoyur göndərmək. çağırın və göndərmək. götürən metodları tətbiq edin növü ilk arqument kimi simli. Məsələn, D3 3.x-də belə deyə bilərsiniz:

Göndərmək üçün a foo D3 4.0-dakı hadisə, deyərdiniz:

The göndərmək.on metod artıq birdən çox hadisə adı qəbul edir, eyni zamanda birdən çox hadisə üçün dinləyici əlavə etməyə və ya silməyə imkan verir. Məsələn, ikisini də göndərmək foobar hadisələr eyni dinləyiciyə:

Bu yeni davranışına uyğun gəlir seçim.d3 seçimində. The göndərmək.on metod artıq göstəricini təsdiqləyir dinləyici gələcəkdə bir səhv atmaqdansa bir funksiyadır.

Yeni tətbiqetmə d3.dispatch, performansı artırmaq üçün daha az qapanma istifadə edərək daha sürətli olur. Yenisi də var göndərmək.Dispetçerin surətini çıxarmaq üçün kopyalama metodu, keçiddəki bütün elementlərin eyni keçid hadisəsi dinləyicilərinə sahib olduğu ümumi vəziyyətdə keçidlərin performansını yaxşılaşdırmaq üçün d3-keçid tərəfindən istifadə olunur.

D3.behavior.drag sürükləmə davranışı d3.drag olaraq dəyişdirildi. The sürükləyin.origin metodu ilə əvəz edilmişdir sürükləyinsürükləmə jestinin əvvəlində süründürülən şeyi təyin etməyə imkan verən .subject.Bu, sürüklənə bilən obyektlərin ümumiyyətlə bir Canvas elementini paylaşdığı Canvas ilə xüsusilə faydalıdır (sürüklənə bilən obyektlərin fərqli DOM elementlərinə sahib olduğu SVG-dən fərqli olaraq) dairəni süründürmə nümunəsinə baxın.

Yeni sürükləyin.container metodu sürükləmə jest koordinat sistemini təyin edən əsas elementi ləğv etməyə imkan verir. Bu, sürükləmə davranışının tətbiq olunduğu elementin ana düyününə görə standartdır. Canvas elementlərini sürükləmək üçün, ehtimal ki, Canvas elementini qab kimi istifadə etmək istəyirsiniz.

Hadisələri sürükləyin hadisə.cari sürüşmə jestinin müddəti üçün müvəqqəti dinləyicilərin qeydiyyatı üçün bir metod, bu dinləyicilər sürüklənən şey kimi cari jest üçün vəziyyəti əldə edə bilərlər. Yeni hadisə.aktiv mülkiyyət, birdən çox (çox toxunma) sürükləmə jestlərinin eyni vaxtda aktiv olub olmadığını müəyyən etməyə imkan verir. The dragstartsürükləyin hadisələrin adı dəyişdirildi başlamaqson. Varsayılan olaraq, sürükləmə davranışları indi kontekst menyusunun istifadəsi üçün nəzərdə tutulmuş sağ vuruşlara məhəl qoymur sürükləyin.hansı hadisələrin laqeyd qaldığını idarə etmək üçün süzgəc. Süründürmə davranışı, iOS-dakı səciyyəli siçan hadisələrini də nəzərə almır. Sürükləmə davranışı indi işlənmiş hadisələri istehlak edir və böyüdülmə kimi digər interaktiv davranışlarla birləşməyi asanlaşdırır.

Yeni d3.dragEnable və d3.dragDisable metodları brauzerlərdə və cihazlarda sürükləmə hərəkətlərini həyata keçirmək üçün aşağı səviyyəli bir API təmin edir. Bu metodlar fırça kimi digər D3 komponentləri tərəfindən də istifadə olunur.

Böyük ad sahəsinin düzəldilməsinə əsasən, müxtəlif CSV və TSV metodlarının yeni adları var:

  • d3.csv.parse ↦ d3.csvParse
  • d3.csv.parseRows ↦ d3.csvParseRows
  • d3.csv.format ↦ d3.csvFormat
  • d3.csv.formatRows ↦ d3.csvFormatRows
  • d3.tsv.parse ↦ d3.tsvParse
  • d3.tsv.parseRows ↦ d3.tsvParseRows
  • d3.tsv.format ↦ d3.tsvFormat
  • d3.tsv.formatRows ↦ d3.tsvFormatRows

Müvafiq formatlardakı faylların yüklənməsi üçün d3.csv və d3.tsv metodlarının adı dəyişdirilməyib, lakin! Bunlar d3-request-də müəyyən edilmişdir. Bunun əvəzinə bir DSV formatlayıcı, bir DSV ayrıştırıcısı və bir DSV sorğuçusunu təyin etmək üçün üçqat məqsədə xidmət edən bir d3.dsv metodu yoxdur, yalnız bir DSV təyin etmək üçün istifadə edə biləcəyiniz d3.dsvFormat var. formatlaşdırıcı və təhlilçi. İstifadə edə bilərsən xahiş.təsdiq etmək üçün cavab və sonra cavab orqanını təhlil etmək və ya sadəcə d3.text istifadə etmək.

The dsv.parse metodu artıq sütun adlarını və onların giriş sırasını belə göstərir məlumat. sütunlar. Misal üçün:

İsteğe bağlı bir sıra sütun adlarını da ötürə bilərsiniz dsv.formatlar yalnız sütunların bir alt hissəsini formatlaşdırmaq və ya sütun sırasını açıq şəkildə göstərmək üçün:

Ayrıştırıcı bir az daha sürətli və formatlaşdırıcı bir az daha möhkəmdir: girişlər formatlanmadan, qaranlıq bir qəzanı düzəltmədən və geri düşməyin köhnəlmiş dəstəyindən əvvəl sətirlərə məcbur edilir. dsv.formatRows zaman giriş məlumat bir sıra massivi silindi.

D3 3.x bu sətirlərin d3.ease-yə ötürülə biləcəyi asanlaşdırma metodlarını müəyyənləşdirmək üçün "kub-in-out" kimi istifadə edilmiş simlər. keçid.rease. D3 4.0 əvəzinə d3.easeCubicInOut kimi simvollardan istifadə edir. Simvollar daha sadə və təmizdir. Daha kiçik xüsusi paketlər istehsal etmək üçün Rollup ilə yaxşı işləyirlər. İstədiyiniz təqdirdə, özünüzü asanlaşdırma funksiyanızı müəyyənləşdirə bilərsiniz. Ekvivalentlərin tam siyahısı:

  • xətti ↦ d3.easeLinear¹
  • lineer-in ↦ d3.easeLinear¹
  • lineer-out ↦ d3.easeLinear¹
  • lineer-in-out ↦ d3.easeLinear¹
  • lineer-out-in ↦ d3.easeLinear¹
  • poly-in ↦ d3.easePolyIn
  • poly-out ↦ d3.easePolyOut
  • poly-in-out ↦ d3.easePolyInOut
  • poly-out-in ↦ ÇIXARILDI²
  • quad-in ↦ d3.easeQuadIn
  • quad-out ↦ d3.easeQuadOut
  • quad-in-out ↦ d3.easeQuadInOut
  • quad-out in ÇIXARILDI²
  • kub-in ↦ d3.easeCubicIn
  • kubikli ↦ d3.easeCubicOut
  • kubikli giriş ↦ d3.easeCubicInOut
  • kub çıxışı ↦ ÇIXARILDI²
  • sin-in ↦ d3.easeSinIn
  • sin-out ↦ d3.easeSinOut
  • sin-in-out ↦ d3.easeSinInOut
  • sin-out-in ↦ ÇIXARILDI²
  • exp-in ↦ d3.easeExpIn
  • exp-out ↦ d3.easeExpOut
  • exp-in-out ↦ d3.easeExpInOut
  • exp-out-in ↦ ÇIXARILDI²
  • dairə daxilində ↦ d3.easeCircleIn
  • dairəvi çıxış ↦ d3.easeCircleOut
  • dairə xaricində ↦ d3.easeCircleInOut
  • dairə xaricində ↦ ÇIXARILDI²
  • elastik-in ↦ d3.easeElasticOut²
  • elastik-çıxış ↦ d3.easeElasticIn²
  • elastik giriş-çıxarıldı ↦ ÇIXARILDI²
  • elastik-çıxış ↦ d3.easeElasticInOut²
  • geri qayıt ↦ d3.easeBackIn
  • geri qayıt ↦ d3.easeBackOut
  • geri qayıt out d3.easeBackInOut
  • geri qayıt ↦ ÇIXARILDI²
  • sıçrayış ↦ d3.easeBounceOut²
  • sıçrayış out d3.easeBounceIn²
  • sıçrayış-in-out ↦ Çıxarıldı²
  • sıçrama-out in d3.easeBounceInOut²

¹ Xətti asanlaşdırmanın -in, -out və -in-out variantları eynidir, buna görə yalnız d3.easeLinear var.
² Elastik və sıçrayış azaldılması səhvən 3.x-də geri çevrildi, beləliklə 4.0-in asanlıqla aradan qaldırılması!

Rahatlıq üçün, hər bir asanlaşdırma metodu üçün standart təxəllüllər də mövcuddur. Məsələn, d3.easeCubic, d3.easeCubicInOut üçün ləqəbdir. İstisnaları çıxartmaq üçün ən çox default, d3.easeBounce və d3.easeElastic-dir, əvvəlcədən -out üçün.

D3.ease və ya isteğe bağlı arqumentləri ötürmək əvəzinə keçid.ease, parametrləşdirilə bilən asanlaşdırma funksiyaları artıq parametrlərə malikdir: poli.sifət, elastik.plaqlıq, elastik.dövr və geri.təkəltmə. Məsələn, D3 3.x-də belə deyə bilərsiniz:

D3 4.0-dakı ekvivalent:

Yüngülləşdirmə funksiyalarının bir çoxu performans və dəqiqlik üçün optimize edilmişdir. Bir neçə səhv düzəldildi, məsələn geri çəkmə üçün aşma parametrinin şərhi və elastik asanlaşdırma üçün dövr parametri. Ayrıca, d3-keçid indi keçidin son işarəsinin tam olaraq baş verəcəyini açıq şəkildə təmin edir t = 1, bəzi asanlaşdırma funksiyalarında üzən nöqtə səhvlərindən qaçınmaq.

Artıq yeni asanlaşdırma funksiyalarına gözəl bir vizual istinad və cizgi bir müraciət var!

D3.layout.force qüvvə düzeni d3.forceSimulation olaraq dəyişdirildi. Güc simulyasiyası artıq qovşaqların mövqelərini izləyən Verlet mövqeyi deyil, sürət Verlet inteqrasiyasından istifadə edir (düyün.x, düyün.y) və sürətlər (düyün.vx, düyünəvvəlki mövqelərindən çox (.vy)düyün.px, düyün.py).

Bir sıra daxili qüvvələrin kodlaşdırılmasından çox, güc simulyasiyası artıq genişlənə bilər: istədiyiniz qüvvələri təyin edirsiniz! Yanaşma kompozisiya ilə daha çox elastiklik verir. Yeni qüvvələr də daha çevikdir: güc parametrləri ümumiyyətlə hər qovşaq üçün və ya hər keçid üçün konfiqurasiya edilə bilər. Üçün ayrıca yerləşdirmə qüvvələri var xy əvəz edən güc.ağırlıq x.x və y. əvəz edirəm güc.ölçülü. Yeni keçid qüvvəsi əvəz edir güc.linkStrength və sabitliyi yaxşılaşdırmaq üçün daha yaxşı defolt heuristika istifadə edir. Yeni çox bədən qüvvəsi əvəz edir güc.Şarj edir və 4.0’ın yeni quadtrees sayəsində yeni minimum məsafə parametrini və performans inkişaflarını dəstəkləyir. Düyünlərin mərkəzləşdirilməsi və toqquşma həlli üçün yeni qüvvələr də mövcuddur.

Yeni qüvvələr və simulyasiya qeyri-müəyyənlikdən qaçınmaq üçün diqqətlə hazırlanmışdır. Düyünləri təsadüfi şəkildə işə salmaqdansa, düyünlərin əvvəlcədən təyin olunmuş mövqeləri yoxdursa, filotaksis qaydasında yerləşdirilir:

Təsadüfi düyünlər varsa əlaqə, toqquşma və çox bədən qüvvələrini həll etmək üçün hələ də təsadüfi sarsıntıya ehtiyac var, lakin ən azı ümumi vəziyyətdə, güc simulyasiyası (və nəticədə gücə yönəlmiş qrafik düzeni) brauzerlərdə və yenidən yüklənmələrdə artıq uyğun gəlir. D3 artıq zar oynamır!

Güc simulyasiyasının, istilik üzərində daha böyük nəzarət üçün bir neçə yeni metodu var simulyasiya.alfaMin və simulyasiya.alphaDecay və daxili taymer. Zəng simulyasiya.alpha artıq vasitəsilə müstəqil olaraq idarə olunan daxili taymer üzərində heç bir təsiri yoxdur simulyasiya.stop və simulyasiya.yenidən başlamaq. Güc planının daxili taymeri artıq yaradıldıqda avtomatik olaraq başlayır və silinir güc.başlamaq. 3.x-də olduğu kimi simulyasiyanı əl ilə inkişaf etdirə bilərsiniz simulyasiya. gənə. The güc. sürtünmə parametri ilə əvəz olunur simulyasiya. sürət gecikmə. Yeni simulyasiya.alphaTarget metodu simulyasiyanın istədiyiniz alfa (temperaturu) təyin etməsinə imkan verir, beləliklə simulyasiya qarşılıqlı əlaqə zamanı hamar bir şəkildə qızdırıla bilər və sonra yenidən hamar bir şəkildə soyudulur. Bu, qarşılıqlı əlaqə zamanı qrafikin sabitliyini yaxşılaşdırır.

Güc düzeni artıq sürükləmə davranışından asılı deyil, baxmayaraq ki, sürüklənə bilən güc yönəlmiş qrafiklər yarada bilərsiniz! Dəst düyün.fx və düyün.fy bir qovşaq mövqeyini düzəltmək üçün. Voronoi SVG örtükünə alternativ olaraq, indi istifadə edə bilərsiniz simulyasiya.bir göstəriciyə ən yaxın düyünü tapmaq üçün tapın.

Bir dəqiqlik göstərilməyibsə, formatlaşdırma davranışı dəyişdi: istisna olmaqla bütün direktivlər üçün 6-lıq bir dəqiqlik var yox, bu, 12-yə qaytarır, 3.x-də, dəqiqlik göstərməmisinizsə, rəqəm ən qısa nadir təqdimatından istifadə edərək formatlaşdırılmışdır (hər nömrə.toString) bu, üzən nöqtə riyaziyyatına görə gözlənilməz rəqəmlərə səbəb ola bilər. 4.0-da yeni standart həssaslıq daha tutarlı nəticələr verir:

Əhəmiyyətsiz arxada duran sıfırları kəsmək üçün istifadə edin yox oxşar g olan direktiv. Misal üçün:

Başlıq altında rəqəm formatlaması istifadə edərək çox böyük və çox kiçik rəqəmlərlə dəqiqliyi artırdı nömrəMantisanı və eksponenti çıxarmaq üçün Math.log yerinə .toExponential. Mənfi sıfır (-0, bir IEEE 754 quruluşu) və sıfıra yuvarlanan çox kiçik rəqəmlər artıq imzasız sıfır kimi formatlaşdırılır. Təbii olaraq təhlükəli d3.round metodu d3.requote ilə birlikdə silindi.

D3.formatPrefix metodu dəyişdirildi. Bir SI-prefiks simli qaytarmaq əvəzinə, verilmiş bir SI-prefiks format funksiyasını qaytarır spesifikator və arayış dəyər. Məsələn, minləri formatlaşdırmaq üçün:

S format direktivindən fərqli olaraq d3.formatPrefix daima eyni SI prefiksindən istifadə edir və ardıcıl nəticələr verir:

Yeni (işarə seçimi mənfi dəyərlər üçün mötərizədən istifadə edir. Bu, xüsusilə $ ilə birlikdə faydalıdır. Məsələn:

Yeni = align seçimi hər hansı bir işarəni və simvolu hər hansı bir dolğunun soluna yerləşdirir:

B, o, d və x direktivləri, tam olmayan rəqəmlər üçün boş sətri qaytarmaq əvəzinə, ən yaxın tam ədədə yuvarlanır:

C təlimatı artıq xarakter məlumatları üçündür (yəni, kod kodları üçün deyil). Yalnızca dolgu və hizalama tətbiq etmək istəyirsinizsə və nömrələrin formatlanması ilə maraqlanmasanız faydalıdır. Məsələn, bədnam sol yastıq (həmçinin mərkəz və sağ yastıq!) Aşağıdakı kimi rahatlıqla həyata keçirilə bilər:

Təklif olunan ondalık dəqiqliklərin hesablanması üçün bir neçə yeni metod mövcuddur ki, bunlar gənə formatlaşdırmaq üçün d3-miqyasda istifadə olunur və xüsusi say formatlarını tətbiq etmək üçün faydalıdır: d3.precisionFixed, d3.precisionPrefix və d3.precisionRound. Format spesifikatorlarını təhlil etmək, doğrulamaq və ayıklamaq üçün yeni bir d3.formatSpecifier metodu da mövcuddur, məsələn, dəqiqliyi avtomatik olaraq dəyişdirmək istədiyiniz zaman.

İndi d3.formatDefaultLocale istifadə edərək standart yeri təyin edə bilərsiniz! Yerli yerlər JSON-dan npm-ə kimi dərc olunur.

Böyük ad sahəsinin düzəldilməsinə əsasən, müxtəlif metodların yeni adları var:

  • d3.geo.graticule ↦ d3.geoGraticule
  • d3.geo.circle ↦ d3.geoCircle
  • d3.geo.area ↦ d3.geoArea
  • d3.geo.bounds ↦ d3.geoBounds
  • d3.geo.centroid ↦ d3.geoCentroid
  • d3.geo.distance ↦ d3.geoDistance
  • d3.geo.interpolate ↦ d3.geoInterpolate
  • d3.geo.length ↦ d3.geoLength
  • d3.geo.rotation ↦ d3.geoRotation
  • d3.geo.stream ↦ d3.geoStream
  • d3.geo.path ↦ d3.geoPath
  • d3.geo.projection ↦ d3.geoProjection
  • d3.geo.projectionMutator ↦ d3.geoProjectionMutator
  • d3.geo.albers ↦ d3.geoAlbers
  • d3.geo.albersUsa ↦ d3.geoAlbersUsa
  • d3.geo.azimuthalEqualArea ↦ d3.geoAzimuthalEqualArea
  • d3.geo.azimuthalEquidistant ↦ d3.geoAzimuthalEquidistant
  • d3.geo.conicConformal ↦ d3.geoConicConformal
  • d3.geo.conicEqualArea ↦ d3.geoConicEqualArea
  • d3.geo.conicEquidistant ↦ d3.geoConicEquidistant
  • d3.geo.quirectangular ↦ d3.geoEquirectangular
  • d3.geo.gnomonic ↦ d3.geoGnomonic
  • d3.geo.mercator ↦ d3.geoMercator
  • d3.geo.orthographic ↦ d3.geoOrthographic
  • d3.geo.stereographic ↦ d3.geoStereographic
  • d3.geo.transverseMercator ↦ d3.geoTransverseMercator

Həm də tutarlılığa görə dəyişdirildi:

  • dairə.origin ↦ dairə.Mərkəz
  • dairə.bucaqlı ↦ dairə.radius
  • qarmaqarışıq.macorExtent ↦ qarmaqarışıq.extentMajor
  • qarmaqarışıq.minorExtent ↦ qarmaqarışıq.extentMinor
  • qarmaqarışıq.majorStep ↦ qarmaqarışıq.stepMajor
  • qarmaqarışıq.minorStep ↦ qarmaqarışıq.stepMinor

Proqnozlar artıq daha uyğun standartdır. Məsələn, d3.geoOrthographic, yalnız ön yarımkürəni göstərən 90 ° klip açısına və d3.geoGnomonic standart olaraq 60 ° klip bucağına malikdir. D3.geoPath üçün standart proyeksiya artıq d3.geoAlbersUsa üçün boşdur, əvvəlcədən proqnozlaşdırılan həndəsə ilə sıfır bir proyeksiya istifadə olunur və göstərilməsi daha sürətli olur.

“Düşmə proqnozları” - proyeksiya yerinə bir funksiyanı keçdiyiniz zaman yol.proyeksiya - artıq dəstəklənmir. Coğrafi proqnozlar üçün xüsusi bir proyeksiya təyin etmək üçün d3.geoProjection və ya d3.geoProjectionMutator istifadə edin. Təsadüfi həndəsə çevrilmələri üçün axın interfeysini tətbiq edin, həmçinin d3.geoTransform-a baxın. "Xam" proqnozlar (məsələn, d3.geo.equirectangular.raw) artıq ixrac edilmir.

Böyük ad sahəsinin düzəldilməsinə görə:

  • d3.layout.cluster ↦ d3.cluster
  • d3.layout.ierarchy ↦ d3.ierierchy
  • d3.layout.pack ↦ d3.pack
  • d3.layout.partition ↦ d3.partition
  • d3.layout.tree ↦ d3.tree
  • d3.layout.treemap ↦ d3.treemap

Hiyerarşik məlumatları (məsələn, bir çox D3 nümunəsi tərəfindən istifadə olunan “flare.json formatı”) təmsil etmək üçün JSON istifadə etməyə alternativ olaraq, yeni d3.stratify operatoru cədvəlli məlumatların iyerarxik məlumatlara çevrilməsini asanlaşdırır! Bir SQL sorğusu və ya CSV faylı nəticəsi kimi cədvəlli bir formatda məlumatlarınız varsa, bu əlverişlidir:

Bunu kökə çevirmək düyün:

Nəticə kök belə bir ağac diaqramı yaratmaq üçün d3.tree-yə keçmək olar:

D3.hierarchy istifadə edərək JSON məlumatlarından kök qovşaqları da yaradıla bilər. İndi iyerarxiya düzənləri bu kök qovşaqlarını birbaşa JSON məlumatları üzərində işləmək əvəzinə giriş olaraq qəbul edir, bu da giriş məlumatları və hesablanmış yer arasında daha təmiz bir ayrılma təmin etməyə kömək edir. (Məsələn, istifadə edin düyün. düzəliş dəyişikliklərini təcrid etmək üçün kopyalayın.) API-ni də asanlaşdırır: dəyər tətbiq etmə ehtiyacı olan hər bir iyerarxiya düzəlişindən daha çox ümumi var. düyün.sum və düyün.hər hansı bir iyerarxiya düzeni ilə işləyən sort metodları.

Yeni d3.hierarchy API, hiyerarşik məlumatları idarə etmək üçün daha zəngin metodlar dəsti də təmin edir. Məsələn, bütün qovşaqlardan topoloji qaydada bir sıra yaratmaq üçün istifadə edin düyün.yalnız yarpaq düyünləri üçün nəsillər, istifadə edin düyün. yarpaqlar. Verilənin əcdadlarını vurğulamaq üçün düyün siçan üzərində istifadə edin düyün. atalar. Bir sıra yaratmaq müəyyən bir iyerarxiya üçün əlaqələr, istifadə edin düyün.bu əvəz edir treemap.başqa planlarda bağlantılar və bənzər metodlar. Yeni düyün.path metodu d3.layout.bundle əvəz edir, həmçinin hiyerarşik kənar paket üçün d3.curveBundle-a baxın.

İyerarxiya planları yeni, rekursiv olmayan keçid metodlarından istifadə edərək yenidən yazılmışdır (düyün.hər biri, düyün.hər biri sonra və düyün. əvvəllər), böyük məlumat dəstlərindəki performansı artırmaq. D3.tree layout artıq a istifadə etmir düyün._ layout zamanı müvəqqəti vəziyyəti saxlamaq üçün sahə.

Treemap plitəsi artıq genişləndirilir treemap. kirəmit! Varsayılan kvadratik döşəmə alqoritmi, d3.treemapSquarify, tamamilə yenidən yazılmış, performans yaxşılaşdırılmış və yastıqlama və yuvarlaqlaşdırmada səhvlər düzəldilmişdir. The treemap.sticky metodu d3.treemapSquarify ilə eyni olan d3.treemapResquarify ilə əvəz edilmişdir, sabit qonşu qoruyan yeniləmələr yerinə yetirir. The treemap.ratio metodu ilə əvəz edilmişdir kvadratlaşdırmaq.nisbət. Və ikili treemaps üçün yeni bir d3.treemapBinary var!

Xəritənin doldurulması da yaxşılaşdırılmışdır. Artıq treemap, valideynləri övladlarından ayıran xarici yastıqla qonşu bacıları ayıran daxili yastıqları ayırd edir. Üst, sağ, alt və sol xarici dolguları ayrı-ayrılıqda təyin edə bilərsiniz. Ənənəvi yuvalanmış treemap və Lü və Fogarty-nin kaskadlı xəritəsi üçün yeni nümunələr var. Və d3.nest-i d3.treemap ilə göstərən yeni bir nümunə var.

Yer dolduran lay3 d3.treemap və d3.partition artıq çıxdı x0, x1, y0, y1 yerinə hər bir qovşaqda x0, dx, y0, dy. Bu, üzən nöqtə riyaziyyatına görə bəzən bir az söndürülmək əvəzinə qonşu hüceyrələrin kənarlarının tam bərabər olmasını təmin edərək dəqiqliyi artırır. Bölmə düzeni artıq yuvarlaqlaşdırma və dolguları dəstəkləyir.

D3.pack dairəsi qablaşdırma düzeni, Wang və digərlərinin alqoritmini daha yaxşı tətbiq etmək, əsas səhvləri düzəltmək və nəticələri yaxşılaşdırmaq üçün tamamilə yenidən yazılmışdır! Welzl’in alqoritmi indi Wang və digərlərinin istifadə etdiyi təxmini cavabı deyil, hər bir valideyn üçün ən kiçik əhatə dairəsini hesablamaq üçün istifadə olunur. 3.x çıxış solda 4.0-da sağda göstərilir:

Hiyerarşik olmayan bir tətbiq d3.packSiblings kimi mövcuddur və ən kiçik əhatə dairəsi tətbiqetmə d3.packEnclose kimi mövcuddur. Paket dolması artıq bir valideynlə övladları arasında və bitişik qardaşlar arasında da tətbiq olunur. Bundan əlavə, artıq hər bir valideyn üçün dinamik olaraq hesablanan bir funksiya kimi dolğu təyin edə bilərsiniz.

D3.rebind metodu silindi. (3.x mənbəyinə baxın.) Getter-setter metodunu bağlamaq istəyirsinizsə, tövsiyə nümunəsi bir sarma metodunu tətbiq etmək və qaytarma dəyərini yoxlamaqdır. Məsələn, a komponent daxili istifadə edir göndərmək, komponent.bir qayıda bilər göndərməkaşağıdakı kimi:

D3.functor metodu silindi. (3.x mənbəyinə baxın.) Bir funksiyaya sabit bir dəyər təqdim etmək istəyirsinizsə, tövsiyə olunan model sabit dəyəri qaytaran bir qapanma tətbiq etməkdir.İstəyirsinizsə, köməkçi üsuldan aşağıdakı kimi istifadə edə bilərsiniz:

Bir dəyər verilir x, təbliğ etmək x onsuz da bir funksiyaya:

D3.interpolate metodu artıq davranışı silinmiş d3.interpolators-a nümayəndə deyil, indi kitabxana tərəfindən təyin olunur. İndi ümumi vəziyyətdə bir az daha sürətli b bir rəqəmdir. Yalnızca d3.interpolateRgb istifadə edir b etibarlı bir CSS rəng göstəricisidir (və təxminən bir deyil). Və son dəyər b null, undefined, true və ya false, d3.interpolate artıq həmişə dönən sabit bir funksiyanı qaytarır b.

D3.interpolateObject və d3.interpolateArray davranışı başlanğıc dəyərindəki xüsusiyyətlərə və ya elementlərə nisbətən bir qədər dəyişdi. a son dəyərində olmayan b: bu xüsusiyyətlər və elementlər indi nəzərə alınmır ki, interpolatorun bitmə dəyəri at t = 1 indi tam olaraq bərabərdir b. Beləliklə, 3.x-də:

Halbuki 4.0, a.bar nəzərə alınmır:

Əgər a və ya b tərifsizdir və ya bir obyekt deyildirlər, onlar artıq bir TypeError atmaqdansa, uyğun olaraq boş obyektə və ya boş massivə çevrilirlər.

D3.interpolateTransform interpolatorun adı d3.interpolateTransformSvg olaraq dəyişdirildi və CSS çevrilmələrini interpolasiya etmək üçün yeni bir d3.interpolateTransformCss var! Bu, d3-keçidin həm SVG çevirmə atributunu, həm də CSS çevirmə üslub xüsusiyyətini avtomatik olaraq interpolasiya etməsinə imkan verir. (Bununla birlikdə, yalnız 2D CSS çevrilməsinin dəstəkləndiyini unutmayın.) D3.transform metodu silindi.

Rəng məkanı interpolatorları artıq qeyri-şəffaflığı interpolasiya edirlər (bax: d3-rəng) və RGB onaltılı formatını istifadə etmək əvəzinə rgb (…) və ya rgba (...) CSS rəng təyinedici sətirlərini qaytarırlar. Bu qeyri-şəffaflıq interpolasiyasını dəstəkləmək üçün lazımdır, eyni zamanda CSS hesablanmış dəyərlərinə uyğun gəldiyindən faydalıdır. Bir kanal başlanğıc rəngində olduqda a təyin olunmamışdır, rəng interpolatorları artıq son rəngin müvafiq kanal dəyərindən istifadə edirlər b, və ya əksinə. Bu məntiq əvvəllər bəzi kanallara tətbiq olundu (HSL-də doyma kimi), lakin indi bütün rəng sahələrindəki bütün kanallara tətbiq olunur və xüsusilə şəffafdan interpolasiya edilərkən faydalıdır.

Artıq silindrik rəngli interpolatorların “uzun” versiyaları mövcuddur: d3.interpolateHslLong, d3.interpolateHclLong və d3.interpolateCubehelixLong. Bu interpolatorlar, 360 ° hue dairəsi ətrafında ən qısa yoldan istifadə etmək əvəzinə, rənglərin xətti interpolasiyasından istifadə edirlər. Nümunə üçün d3.interpolateRainbow-a baxın. Cubehelix rəng sahəsi artıq d3-color tərəfindən dəstəklənir və buna görə də indi d3.interpolateCubehelix və d3.interpolateCubehelixLong interpolatorları mövcuddur.

Gamma-düzəldilmiş rəng interpolasiyası artıq həm RGB, həm də Cubehelix rəng sahələri üçün dəstəklənir interpolasiya etmək.qamma. Məsələn, RGB məkanında 2,2 qamma ilə bənövşəyi rəngdən narıncıya interpolasiya etmək:

Vahid qeyri-rasional B-splines üçün yeni interpolatorlar var! Bunlar, ixtiyari dəyərlər ardıcıllığı arasında rəvan interpolasiya üçün faydalıdır t = 0 ilə t = 1, məsələn ayrı-ayrı rənglər dəstindən hamar rəng qradiyenti yaratmaq. D3.interpolateBasis və d3.interpolateBasisClosed interpolatorları bir ölçülü B-splines, d3.interpolateRgbBasis və d3.interpolateRgbBasisClosed isə RGB rəng sahəsi ilə üç ölçülü B-splines yaradır. Bunlar, d3-miqyaslı-xromatik tərəfindən, ColorBrewer’in PiYG kimi ayrı-ayrı rəng sxemlərindən davamlı rəng tərəziləri yaratmaq üçün istifadə olunur.

Artıq fasiləsiz interpolatordan bərabər məsafəli ayrı-ayrı nümunələr yaratmaq üçün bir d3.quantize metodu da mövcuddur. Bu, quraşdırılmış rəng tərəzilərindən birini (məsələn, d3.interpolateViridis) götürmək və d3.scaleQuantize, d3.scaleQuantile və ya d3.scaleThreshold ilə istifadə üçün ölçmək üçün faydalıdır.

D3.path serializer, CanvasPathMethods API tətbiq edir və Canvas ya da SVG-də göstərilə bilən kod yazmağa imkan verir. Məsələn, bir kətana çəkən bəzi kodlar verilmişdir:

SVG-yə aşağıdakı kimi göstərə bilərsiniz:

Yol serializatoru, d3 şəklinin həm Canvas, həm də SVG-ə baxmasını dəstəkləyir xətt.text və sahəMəsələn, mətn.

Artıq bir d3.geom.polygon konstruktoru yoxdur, bunun əvəzinə çoxbucaqlı metodlara bir sıra zirvələr ötürürsünüz. Yəni əvəzinə çoxbucaqlı.area və çoxbucaqlı.centroid, d3.polygonArea və d3.polygonCentroid var. Yeni d3.polygonContains və d3.polygonLength metodları da mövcuddur. Artıq buna bərabər bir şey yoxdur çoxbucaqlı.clip, lakin Sutherland – Hodgman kəsiminə ehtiyac varsa, xahiş edirəm bir xüsusiyyət sorğusu göndərin.

D3.geom.hull operatoru sadələşdirilmişdir: ilə operator əvəzinə gövdə.x və gövdə.yaxşılarım, yalnız bir sıra nöqtələr götürən və qabarıq gövdəni qaytaran d3.polygonHull metodu var.

D3.geom.quadtree metodu d3.quadtree ilə əvəz edilmişdir. 4.0 quadtree "generatorları" (bir sıra məlumatlardan bir quadtree quran konfiqurasiya edilə bilən funksiyalar) konsepsiyasını aradan qaldırır, indi yalnız d3.quadtree vasitəsilə yarada biləcəyiniz və dördüncü ağaclar var. quadtree.və əlavə edin quadtree.tamam. Bu kod 3.x-də:

4.0-da yenidən yazmaq olar:

Yeni quadtree tətbiqi olduqca yaxşılaşdırıldı! Çox sayda üst-üstə düşən nöqtələr olduqda yığın daşmalarından qaçınaraq artıq rekursiv deyil. Daxili yaddaş artıq daha effektivdir və tətbiq də normal olaraq paylanmış 1M nöqtələrdən ibarət bir dördlü ağacın 3.x-da üç saniyəyə nisbətən 4.0 saniyədə bir saniyə çəkdiyini daha sürətli bir şəkildə qurur.

Daxili dəyişiklik düyün quruluşu təsir edir quadtree. ziyarət: istifadə düyün.yarpaq düyünlərini daxili düyünlərdən ayırmaq üçün uzunluq. Məsələn, quadtree-dəki bütün məlumatları təkrarlamaq üçün:

Yenisi var quadtree.visitAyrış sonrası keçiddə qovşaqları ziyarət üçün metod. Bu xüsusiyyət D3-gücdə Barnes-Hut yaxınlaşmasını həyata keçirmək üçün istifadə olunur.

İndi istifadə edərək quadtree-dən məlumatları silə bilərsiniz quadtree.götür və quadtree.bütün Quadtree-yə məlumat əlavə edərkən quadtree, yeni nöqtə quadtree'nin mövcud hüdudlarından kənarda olduqda təkrar ikiqat artıraraq genişliyini genişləndirəcəkdir. Həmçinin var quadtree.cümlə və quadtree.yaradıldıqdan sonra quadtree-nin dərəcəsini açıq şəkildə genişləndirmək üçün üsulları əhatə edir.

Quadtrees bir neçə yeni yardım üsullarını dəstəkləyir: quadtree.copy, eyni məlumatları paylaşan dörd ağacın bir nüsxəsini qaytarır quadtree.data dördbucaqdakı bütün məlumatlardan bir sıra yaradır quadtree.size dördüncü ağacdakı məlumat nöqtələrinin sayını qaytarır quadtree.root, quadtree-nin əl ilə keçməsi üçün faydalı olan kök qovşağını qaytarır. The quadtree.find metodu indi məcbur yönəlmiş qrafiklərdə göstərici əsaslı seçim üçün faydalı olan isteğe bağlı bir axtarış radiusu alır.

Əvvəllər Queue.js və queue-async kimi tanınan d3.queue indi standart paketə daxil edilir və bu da məlumatların paralel olaraq yüklənməsini asanlaşdırır. Performansı yaxşılaşdırmaq üçün daha az qapanma ilə yenidən yazılmışdır və indi yaxşı müəyyən edilmiş davranışa zəmanət vermək üçün daha sərt yoxlamalar mövcuddur. İndi instanceof d3.queue istifadə edə və növbənin daxili özəl vəziyyətini yoxlaya bilərsiniz.

Böyük ad sahəsinin düzəldilməsinə əsasən, təsadüfi say generatorlarının yeni adları var:

  • d3. təsadüfi.normal ↦ d3. təsadüfiNormal
  • d3.random.logNormal ↦ d3.random.logNormal
  • d3.random.bates ↦ d3.random.bates
  • d3.random.irwinHall ↦ d3.randomIrwinHall

Üst səviyyəli və vahid paylanmalar üçün yeni təsadüfi say generatorları da mövcuddur. Normal və log-normal təsadüfi generatorlar optimallaşdırılmışdır.

D3.xhr metodu d3.request olaraq dəyişdirildi. Əsas kimlik doğrulaması indi istifadə edərək dəstəklənir xahiş.user və xahişparol. İndi istifadə edərək vaxtaşımı konfiqurasiya edə bilərsiniz xahiş.vaxt.

Bir səhv baş verərsə, müvafiq "error" tipli ProgressEvent artıq XMLHttpRequest əvəzinə səhv dinləyiciyə ötürülür. Eynilə, ProgressEvent, d3.event istifadə etmək əvəzinə inkişaf hadisəsi dinləyicilərinə ötürülür. D3.xml XML-i təhlil edən bir səhvlə qarşılaşırsa, bu səhv indi boş cavab qaytarmaqdansa, səhv dinləyicilərə bildirilir.

D3.request, d3.text və d3.xml metodları artıq ikinci arqument istifadəsi olaraq isteğe bağlı bir mim növü götürmür. xahiş.mimeType əvəzinə. Misal üçün:

D3.html və d3.xml xaricində, Node artıq node-XMLHttpRequest vasitəsilə dəstəklənir.

Böyük ad sahəsinin düzəldilməsinə görə:

  • d3.miqyaslı.xətti ↦ d3.miqyaslıxətti
  • d3.scale.sqrt ↦ d3.scaleSqrt
  • d3.miqyaslı.pow ↦ d3.scalePow
  • d3.scale.log ↦ d3.scaleLog
  • d3. miqyaslı.quantize ↦ d3.miqyaslıQuantize
  • d3. miqyaslı eşik hold d3. miqyaslı eşik
  • d3. miqyaslı.qantil ↦ d3.miqyaslı kvantil
  • d3. miqyaslı şəxsiyyət ↦ d3. miqyaslı şəxsiyyət
  • d3.miqyaslı.ordinal ↦ d3.şkaləOrdinal
  • d3.time.scale ↦ d3.scaleTime
  • d3.time.scale.utc ↦ d3.scaleUtc

Tərəzilər indi domenlə eyni qaydada gənələr yaradır: azalan bir domeniniz varsa, indi azalan gənələr əldə edirsiniz. Bu dəyişiklik baltalar tərəfindən yaradılan gənə elementlərinin sırasını təsir edir. Misal üçün:

Gündəlik işarəsi formatlaması artıq bir borcludur saymaq ondan, sonsuzluq deyil, göstərilməyibsə. Bir çox gücü əhatə edən domenlər ilə giriş tərəziləri (məsələn, 1e + 3-dən 1e + 29-a kimi) indi geri qayıtmaq əvəzinə güc başına yalnız bir gənə verir baza güc başına gənələr. Qeyri-xətti kəmiyyət tərəziləri bir az daha dəqiqdir.

Artıq miqyas öz domenində olmayan bir dəyər ötürüldükdə, adi bir miqyasın domeninin dolayısı ilə genişlənib-uzanmayacağına nəzarət edə bilərsiniz. Varsayılan olaraq, sıradan.unknown d3.scaleImplicit-dir, bu da bilinməyən dəyərlərin domenə əlavə edilməsinə səbəb olur:

Ayarlayaraq sıradan.məlum, əvəzinə naməlum girişlər üçün çıxış dəyərini təyin etmisiniz. Bu, xüsusilə itkin məlumatlara rəng təyin etmək istədiyiniz choropleth xəritələri üçün faydalıdır.

The sıradan.rangeBands və sıradan.rangeRoundBands metodları sıralı miqyaslı yeni bir alt siniflə əvəz edilmişdir: lent tərəziləri. 3.x-də aşağıdakı kod:

4.0-da buna bərabərdir:

Yeni qrupyastıq, qrup.paddingInner və qrup.paddingOuter üsulları isteğe bağlı arqumentləri əvəz edir sıradan.rangeBands. Yeni qrup.bənd genişliyi və qrup.step metodları əvəz edir sıradan.rangeBand. Yenisi də var qrup. bantların xaricindəki əlavə yerin necə paylandığını idarə etmək üçün istifadə edə biləcəyiniz hizalama metodu, deyin sütunları yaxınlaşdırın y-aksis.

Eynilə sıradan.rangePoints və sıradan.rangeRoundPoints metodları sıralı miqyaslı yeni bir alt siniflə əvəz edilmişdir: nöqtə tərəziləri. 3.x-də aşağıdakı kod:

4.0-da buna bərabərdir:

Yeni nöqtə.padding metodu isteğe bağlıdır dolgu arqument sıradan.rangePoint. Kimi sıradan.rangeBand ilə sıradan.rangePoints, the nöqtə.bandwidth metodu həmişə sıfırı yeni qaytarır nöqtə.step metodu bitişik nöqtələr arasındakı intervalı qaytarır.

Sıra miqyaslı konstruktor artıq isteğe bağlıdır üçündür üçün daha qısa bir alternativ üçün sıradan.aralığı. Bu, xüsusən kategorik rəng tərəzilərinin xüsusi sıra şkalası konstruktorlarından daha çox sadə rəng massivlərinə dəyişdirildiyi üçün xüsusilə faydalıdır:

  • d3.scale.category10 ↦ d3.schemeCategory10
  • d3.scale.category20 ↦ d3.schemeCategory20
  • d3.scale.category20b ↦ d3.schemeCategory20b
  • d3.scale.category20c ↦ d3.schemeCategory20c

4.0-da buna bərabərdir:

Ardıcıl tərəzilər, bir sıra əvəzinə sabit bir çıxış interpolatoru olan yeni bir tərəzi sinifidir. Tipik olaraq bu tərəzilər davamlı ardıcıl və ya fərqli rəng sxemlərini tətbiq etmək üçün istifadə olunur. Matplotlib’in yeni qavrayış motivli yeni kolormaplarından ilham alan 4.0, ardıcıl tərəzilərdə istifadə üçün viridis, inferno, magma, plazma interpolatorlarına malikdir. D3.quantize istifadə edərək, bu interpolatorlar kəmiyyət, kəmiyyət və eşik tərəzilərinə də tətbiq edilə bilər.

4.0 ayrıca Dave Green'in defoltu və Matteo Niccoli’dən ilham almış döngüsel bir göy qurşağı da daxil olmaqla yeni Cubehelix sxemlərini göndərir:

Daha ardıcıl və kategorik rəng sxemləri üçün d3 miqyaslı xromatikə baxın.

Tərəzilərə giriş üçün d3 ölçüsünün tətbiqi bölməsinə baxın.

Seçimlər artıq prototip zəncir enjeksiyonundan istifadə edərək alt sinif Array deyil, indi düz bir obyektdir və performansı artırır. Daxili sahələr (seçim._qruplar, seçim._parents) xüsusidır, seçimləri idarə etmək üçün sənədləşdirilmiş ümumi API istifadə edin. Yeni seçim.nodes metodu seçimdəki bütün qovşaqlardan bir sıra yaradır.

Seçimlər indi dəyişməzdir: seçimdəki elementlər və valideynlər heç vaxt dəyişmir. (Elementlərin xüsusiyyətləri və məzmunu, əlbəttə ki, yenə də dəyişdiriləcəkdir!) The seçim.sort və seçim.data metodları artıq seçimi yerində dəyişdirmək əvəzinə yeni seçimlər qaytarır. Əlavə olaraq, seçim.append artıq yeniləmə seçimi istifadəsinə qovşaqları daxil etməyi birləşdirmir seçim. birləşdirildikdən sonra məlumatı birləşdirmək üçün daxil edin və yeniləyin. Məsələn, 3.x-də aşağıdakı ümumi yeniləmə nümunəsi:

4.0-da yenidən yazılacaqdır:

Bu dəyişiklik daha çox proqramı yaxşı edən şeylərdə müzakirə olunur.

3.x-də seçim.enter və seçim.exit metodları siz zəng edənə qədər təyin olunmamışdır seçim.data, bunlara daxil olmağa cəhd göstərdiyiniz halda TypeError ilə nəticələnir. 4.0-da, seçim verilərə qoşulmamışsa, sadəcə boş seçimi geri qaytarırlar.

3.x-də, seçim.append həmişə yeni elementi valideyninin son övladı kimi əlavə edərdi. Az bilinən bir hiylə istifadə etmək idi seçim. göstərmədən daxil edin a əvvəl qovşaqları daxil edərkən seçici, giriş qovşaqlarının yeniləmə seçimində aşağıdakı elementdən əvvəl daxil edilməsinə səbəb olur. 4.0-da, bu artıq varsayılan davranışdır seçim. təyin etməsəniz tətbiq edin əvvəl seçici seçim.insert, daxil edilmiş element son uşaq kimi əlavə olunur. Bu dəyişiklik ümumi yeniləmə nümunəsini elementlərin və məlumatların nisbi sırasını qorumağa məcbur edir. Məsələn, aşağıdakı DOM verilmişdir:

Nəticədə DOM olacaq:

Beləliklə, giriş c, de əvvəllər daxil edilmişdir f, bəri f yeniləmə seçimindəki aşağıdakı elementdir. Bu davranış, yeni məlumatların sırası sabitdirsə, əmri qorumaq üçün yetərli olsa da, məlumatlar sırasını dəyişdirərsə, yenə də istifadə etməlisiniz seçim. elementləri yenidən sıralamaq üçün sifariş.

İndi yalnız bir seçim sinfi var. 3.x həyata keçirilmişdir üçün fərqli davranışı olan xüsusi bir sinif istifadə edərək seçimlərə daxil olun daxil edin.qoşun və daxil edin.sex bu dizaynın nəticəsi 3.x-də seçimlərin müəyyən metodların olmaması idi. 4.0-da, seçimlər eyni üsullara və eyni davranışa sahib olan normal seçimlərdir. Yer tutucu daxil etmə qovşaqları artıq tətbiq olunur düyün.appendChild, düyün.insertƏvvəl, düyün.querySelector və düyün.querySelectorAll.

The seçim.data metodu təkrarlanan düymələrə münasibətdə bir qədər dəyişdirilmişdir. 3.x-də, birdən çox məlumatın eyni açarı olsaydı, təkrarlanan məlumatlar nəzərə alınmayacaq və 4.0-a daxil edilməz, yenilənməz və ya çıxılmazdı, təkrarlanan məlumatlar həmişə giriş seçiminə qoyulur. Həm 3.x, həm də 4.0-da birdən çox element eyni açar varsa, təkrarlanan elementlər çıxış seçiminə qoyulur. Beləliklə, 4.0-in davranışı artıq giriş və çıxmaq üçün simmetrikdir və ümumi yeniləmə nümunəsi artıq təkrarlanan düymələr olsa belə, məlumatlara uyğun bir DOM istehsal edəcəkdir.

Seçimlərdə bir neçə yeni metod var! İstifadə edin seçim. seçilmiş elementləri qardaşlarının qabağına keçirtmək üçün yuxarıya çəkin ki, bunlar ən yaxşı istifadəyə alınsın seçim. onları arxaya daşımaq üçün daha az. İstifadə edin seçimXüsusi bir hadisəni hadisə dinləyicilərinə göndərmək üçün göndər.

Getter rejimində çağırıldıqda, seçim.data indi yalnız birinci qrup elementlər üçün deyil, seçimdəki bütün elementlər üçün məlumatları qaytarır. The seçim.call metodu artıq göstərilən funksiyanı çağırarkən bu konteksti təyin etmir seçim funksiyanın ilk arqumenti kimi ötürülür, buna görə istifadə edin. The seçim.on metodu artıq boşluqdan ayrılmış birdən çox ad adını qəbul edir, beləliklə birdən çox dinləyici əlavə edib silə bilərsiniz. Misal üçün:

Geri çağırma funksiyalarına verilən arqumentlər daha tutarlı olmaq üçün 4.0-da bir qədər dəyişdi. Standart arqumentlər elementin verilənlər bazasıdır (d), elementin indeksi (mən) və element qrupu (qovşaqlar) ilə bu element kimi. Bu konvensiyanın kiçik bir istisnasıdır seçim.data, hər element üçün deyil, hər bir qrup üçün qiymətləndirilir, qrupun ana datumdan keçir (d), qrup indeksi (mən) və seçimin valideynləri (valideynlər) ilə bu qrupun valideynləri kimi.

Yeni d3.local, yerli dəyişənlərin müəyyənləşdirilməsi üçün bir mexanizm təqdim edir: DOM elementləri ilə əlaqəli və istənilən nəsil elementləri üçün mövcud olan vəziyyət. Bu istifadə üçün əlverişli bir alternativ ola bilər seçim.hər bir məlumatı yerli vəziyyətə gətirmək və ya saxlamaq.

D3.ns.prefix ad boşluğu prefiks xəritəsi d3.namespaces, d3.ns.qualify metodu isə d3.namespace olaraq dəyişdirildi. Artıq bir neçə yeni aşağı səviyyəli metod mövcuddur. d3.matcher tərəfindən daxili istifadə olunur seçim.filtre d3.selector tərəfindən istifadə olunur seçim.select d3.selectorAll tərəfindən istifadə olunur seçim.selectAll d3.creator tərəfindən istifadə olunur seçim.qoşun və seçim.sert. Yeni d3.window, verilən element, pəncərə və ya sənəd üçün sahib pəncərəsini qaytarır. Yeni d3.customEvent müvəqqəti olaraq bir funksiyanı çağırarkən d3.event'i təyin edir və bu, d3-drag, d3-zoom və d3-brush tərəfindən istifadə olunan xüsusi hadisələri göndərən nəzarətləri həyata keçirməyə imkan verir.

Parsimonluq naminə çoxsaylı atributları, üslubları və ya xassələri eyni vaxtda təyin etmək üçün bir obyekti ötürdüyünüz çox dəyərli metodlar d3-selection-multi-ə çıxarıldı və artıq standart paketin bir hissəsi deyil. Çox dəyərli xəritə metodları, həddindən artıq yüklənməni azaltmaq üçün çoxluq şəklində də dəyişdirilmişdir: seçim.attrs, seçim. üslublar və seçim.xassələri.

Böyük ad sahəsinin düzəldilməsinə görə:

  • d3.svg.line ↦ d3.line
  • d3.svg.line.radial ↦ d3.radialLine
  • d3.svg.area ↦ d3.area
  • d3.svg.area.radial ↦ d3.radialArea
  • d3.svg.arc ↦ d3.arc
  • d3.svg.symbol ↦ d3.symbol
  • d3.svg.symbolTypes ↦ d3.symbolTypes
  • d3.layout.pie ↦ d3.pie
  • d3.layout.stack ↦ d3.stack
  • d3.svg.diagonal ↦ ÇIXARILDI (bax d3 / d3-forma # 27)
  • d3.svg.diagonal.radial ↦ ÇIXARILDI

Formalar artıq SVG ilə məhdudlaşmır, indi Canvas-a göstərə bilərlər! Forma generatorları artıq isteğe bağlıdır Kontekst: bir CanvasRenderingContext2D verilərkən, bir formanı doldurmaq və ya vurmaq üçün bir kətan yolu kimi göstərə bilərsiniz. Məsələn, bir kətan pasta diaqramı bir qövs generatorundan istifadə edə bilər:

Verilən bir məlumat bazası üçün bir yay göstərmək d:

Görmək xətt.Kontekst, sahə.text və qövs. daha çox məlumat üçün mətn. Başlıq altında, formalar, kontekst sıfır olduqda, kətan yolu göstərmə üçün optimallaşdırıldıqda, kətan yolu üsullarını SVG yol məlumatlarına seriyalaşdırmaq üçün d3 yolundan istifadə edir. Artıq ərazilərdən xətlər əldə edə bilərsiniz. Xətt, eyni girişçilərin əksəriyyətini paylaşır xətt.təyin edilmiş və xətt. əyri, əldə edildiyi sahə ilə. Məsələn, bir sahənin üst xəttini göstərmək üçün istifadə edin sahə.təhsil üçün lineY1, istifadə edin sahə.lineY0.

4.0, xətt və sahə şəkillərinin məlumat nöqtələri arasında necə interpolasiya olunduğunu göstərmək üçün yeni bir əyri API təqdim edir. The xətt.polpolasiya və sahə.polpol üsulları ilə əvəz edilmişdir xətt. əyri və sahə. əyri. Döngələr bir SVG yolu məlumat sətrini qaytaran bir funksiya olaraq deyil, əyri interfeysi istifadə edərək həyata keçirilir, bu da əyrilərin SVG və ya Canvas-a göstərilməsinə imkan verir. Əlavə olaraq, xətt. əyri və sahə. əyri indi verilmiş bir əyri meydana gətirən bir funksiyanı yerinə yetirir Kontekstsimli deyil. Ekvivalentlərin tam siyahısı:

  • xətti ↦ d3. əyriXətti
  • xətti qapalı ↦ d3. əyriXəttiBağlıdır
  • addım ↦ d3.curveStep
  • addım-əvvəl ↦ d3.curveStepBefore
  • addım sonra ↦ d3.curveStepAfter
  • əsas ↦ d3.curveBasis
  • təməl açıq ↦ d3.curveBasisOpen
  • təməl bağlı ↦ d3.curveBasisBağlıdır
  • paket ↦ d3.curveBundle
  • kardinal ↦ d3.curveCardinal
  • kardinal-açıq ↦ d3.curveCardinalAçıq
  • kardinal-qapalı ↦ d3. əyriKardinalBağlıdır
  • monoton ↦ d3.curveMonotoneX

Ancaq bu hamısı deyil! 4.0, Yükselin təklif etdiyi kimi parametrləşdirilmiş Catmull-Rom splines təmin edir və s.. Bunlar d3.curveCatmullRom, d3.curveCatmullRomClosed və d3.curveCatmullRomOpen kimi mövcuddur.

Hər bir əyri növü, əvəzedici olaraq öz adına parametrləri təyin edə bilər xətt.gərginlik və sahə.gərginlik. Məsələn, Catmull-Rom splines parametrləşdirilərək istifadə olunur catmullRom.alfa və defolt olaraq 0.5-ə bərabərdir, bu da öz-özünə kəsişmələrin və həddindən artıq çəkilişin qarşısını alan bir mərkəzdən yayılmış spline uyğun gəlir. Bunun əvəzinə vahid bir Catmull-Rom spline üçün:

4.0, kardinal spline şərhini düzəldir gərginlik indi olaraq göstərilən parametrdir kardinal.gərginlik və vahid bir Catmull-Rom spline üçün sıfıra bərabər bir gərginlik doğrusal bir əyri meydana gətirir. Əsas və kardinal əyrilərin ilk və son seqmentləri də düzəldilmişdir! Sənədsiz interpolasiya etmək. tərs sahə silindi. Döngələr, ardıcıllığı sayaraq toplines və əsas xətlər üçün fərqli davranışı təyin edə bilər əyri.line daxilində başlayın əyri.areaStart. Nümunə üçün d3.curveStep tətbiqinə baxın.

4.0, monoton əyri tətbiqində çoxsaylı səhvləri düzəldir və d3.curveMonotoneY təqdim edir, bu d3.curveMonotoneX kimidir, yalnız giriş nöqtələrinin monoton olması tələb olunur y daha çox x, məsələn, şaquli yönümlü bir xətt cədvəli üçün. Yeni d3.curveNatural təbii bir kub spline istehsal edir. D3.curveBundle üçün varsayılan β, Holten tərəfindən istifadə edilən dəyərlərə uyğun olaraq 0,7 deyil, 0,85-dir. 4.0 ayrıca daha güclü bir yay doldurma tətbiqinə sahibdir qövs.padAngle və qövs.padRadius.

4.0 yeni bir simvol növü API təqdim edir. Simvol növləri ötürülür simvol. simlərin yerinə növü. Ekvivalentlər bunlardır:

  • dairə ↦ d3.symbolCircle
  • çarpaz ↦ d3.symbolCross
  • almaz ↦ d3.symbolDiamond
  • kvadrat ↦ d3.symbolSquare
  • üçbucaq aşağı ↦ Çıxarıldı
  • üçbucaq-↦ d3.symbolTriangle
  • ƏLAVƏ OLDU ↦ d3.symbolStar
  • ƏLAVƏ OLDU ↦ d3.symbolWye

Simvol növlərinin tam dəsti indi:

Nəhayət, 4.0, d3.layout.stack-i d3.stack ilə əvəz edərək yığın düzeni API'sini təmir edir. Yığın generatorunun artıq ehtiyac yoxdur x-akessor. Bundan əlavə, API sadələşdirilmişdir: yığın generator indi cədvəl daxiletməsini qəbul edir, məsələn, bu obyektlər seriyası:

Yığın düzeni yaratmaq üçün əvvəlcə yığın generatorunu təyin edin və sonra məlumatlara tətbiq edin:

Nəticədə serialın hər birində bir element var seriya. Hər seriyanın ayda bir xalı var və hər nöqtənin alt və üst xəttini təyin edən aşağı və yuxarı dəyəri var:

Bundan sonra hər bir seriya bir sahə cədvəlini göstərmək üçün bir sahə generatoruna keçdi və ya bir çubuq chart üçün düzbucaqlı qurmaq üçün istifadə edildi. Yığın generatorları artıq giriş məlumatlarını dəyişdirmir, buna görə yığın.out silindi.

Formalarla tanış olmaq üçün d3 şəklini təqdim etməyə baxın.

Mükəmməl ad sahəsinin düzəldilməsinə əsasən format qurucularının yeni adları var:

The format.parse metodu ayrıca d3.timeParse, d3.utcParse və d3.isoParse ayrıştırıcı konstruktorlarının xeyrinə qaldırıldı. Beləliklə, bu kod 3.x-də:

4.0-da yenidən yazmaq olar:

Çox miqyaslı d3.time.format.multi vaxt formatı d3.scaleTime’in gənə formatı ilə əvəz edilmişdir. Vaxt formatları indi tarixləri girişə məcbur edir və zaman ayırıcıları sətirlərə girişləri məcbur edir. % Z direktivi, indi -0700, -07: 00, -07 və Z kimi zaman zonası ofsetlərini daha çevik təhlil etməyə imkan verir. % P direktivi, bölgənin dövr adı iki simvoldan uzun olduqda, indi düzgün təhlil olunur (məs., “Am”).

Varsayılan ABŞ İngilis dili artıq 12 saatlıq bir vaxt və tarixin daha qisa bir təqdimatını istifadə edir. Bu, yerli konvensiyaya uyğun gəlir və uyğun gəlir Tarix.toLocaleString Chrome, Firefox və Node'da:

İndi d3.timeFormatDefaultLocale istifadə edərək, standart yeri təyin edə bilərsiniz! Yerli yerlər JSON-dan npm-ə kimi dərc olunur.

Vaxt formatlaşdırma və təhlilin performansı yaxşılaşdırıldı və UTC formatlaşdırıcısı və təhlilçi daha təmiz bir tətbiqə sahibdir (bu, Date qlobalının müvəqqəti olaraq ləğv edilməsindən qaçınır).

Böyük ad sahəsinin düzəldilməsinə əsasən yerli vaxt aralıkları dəyişdirildi:

  • QALDI ↦ d3.timeMillisecond
  • d3.time.second ↦ d3.timeSecond
  • d3.time.minute ↦ d3.timeMinute
  • d3.time.saat ↦ d3.time saat
  • d3.time.day ↦ d3.timeDay
  • d3.time.sunday ↦ d3.timeSunday
  • d3.time.monday ↦ d3.timemonday
  • d3.time. çərşənbə axşamı ↦ d3.time. çərşənbə axşamı
  • d3.time.çərşənbə ↦ d3.time.çərşənbə
  • d3.time.hazar ertəsi ↦ d3.timehazar ertəsi
  • d3.time.fümə
  • d3.time.şənbə ↦ d3.timeşənbə
  • d3.time.week ↦ d3.timeWeek
  • d3.time.month ↦ d3.timeMonth
  • d3.time.il ↦ d3.timeYear

UTC vaxt intervalları da eyni şəkildə dəyişdirildi:

  • QALDI ↦ d3.utcMillisecond
  • d3.time.second.utc ↦ d3.utcSecond
  • d3.time.minute.utc ↦ d3.utcMinute
  • d3.time.hour.utc ↦ d3.utc saat
  • d3.time.day.utc ↦ d3.utcDay
  • d3.time.sunday.utc ↦ d3.utcBazar
  • d3.time.monday.utc ↦ d3.utc bazar ertəsi
  • d3.time.sueday.utc ↦ d3.utcsuesday
  • d3.time.çərşənbə.utc ↦ d3.utcçərşənbə
  • d3.time.thursday.utc ↦ d3.utc cümə axşamı
  • d3.time.friday.utc ↦ d3.utcfümə
  • d3.time.saturday.utc ↦ d3.utcşənbə
  • d3.time.week.utc ↦ d3.utcWeek
  • d3.time.month.utc ↦ d3.utcAy
  • d3.time.year.utc ↦ d3.utcYear

Yerli vaxt aralığı takma adları dəyişdirildi:

  • d3.time.seconds ↦ d3.timeSeconds
  • d3.time.minutes ↦ d3.timeMinutes
  • d3.time.saat ↦ d3.time saat
  • d3.time.days ↦ d3.timeDays
  • d3.time.bazar günləri ↦ d3.timebazar günləri
  • d3.time.mondays ↦ d3.timeMondays
  • d3.time.tuesdays ↦ d3.timeTuesdays
  • d3.time.çərşənbə günləri ↦ d3.time.çərşənbə günləri
  • d3.time.thursdays ↦ d3.timeThursdays
  • d3.time.fridays ↦ d3.timeFridays
  • d3.time.saturdays ↦ d3.timeşənbə günləri
  • d3.time.weeks ↦ d3.timeWeeks
  • d3.time.months ↦ d3.timeMonths
  • d3.time.years ↦ d3.timeYears

UTC zaman aralığı takma adları dəyişdirildi:

  • d3.time.seconds.utc ↦ d3.utcSeconds
  • d3.time.minutes.utc ↦ d3.utcMinutes
  • d3.time.hours.utc ↦ d3.utc saat
  • d3.time.days.utc ↦ d3.utcDays
  • d3.time.sundays.utc ↦ d3.utcazar günləri
  • d3.time.mondays.utc ↦ d3.utc bazar ertələri
  • d3.time.tuesdays.utc ↦ d3.utcTuesdays
  • d3.time.wednesdays.utc ↦ d3.utcÇərşənbə günləri
  • d3.time.thursdays.utc ↦ d3.utcThursdays
  • d3.time.fridays.utc ↦ d3.utcFridays
  • d3.time.saturdays.utc ↦ d3.utcşənbə günləri
  • d3.time.weeks.utc ↦ d3.utcWeeks
  • d3.time.months.utc ↦ d3.utcAylar
  • d3.time.years.utc ↦ d3.utcYears

Davranışı interval.range (və d3.timeDays kimi rahatlıq takma adları) zaman dəyişdirildi addım birdən böyükdür. Sahə nömrəsini istifadə edərək qaytarılan tarixləri süzməkdənsə, interval.range indi d3.range kimi davranır: sadəcə atlayır, hər birini geri qaytarır addımci tarix. Məsələn, 3.x-dəki aşağıdakı kod ayın tək günlərini qaytarır:

Tarixlərin qaytarılan dizisinin başlamadığını unutmayın başlamaq tarix, çünki 28 May bərabərdir. Ayrıca 31 May və 1 İyun bir gün fərqlidir, iki deyil! 4.0-dakı d3.timeDays davranışı, ehtimal ki, gözlədiyinizə daha yaxındır:

Bir zaman aralığının süzgəcdən görünməsini istəyirsinizsə (deyək ki, vaxt miqyası gənələri yaratarkən, üst-üstə düşən iki aralığın uyğun olmasına zəmanət verin), yeni istifadə edə bilərsiniz interval.hər metod və ya onun daha ümumi əmisi oğlu interval.filtre:

Artıq zaman aralıkları bir interval. a-dan sonra interval sərhədlərinin sayılması üçün sayma metodu başlamaq tarix və əvvəl və ya bərabərdir son Tarix. Bu, 3.x-də d3.time.dayOfYear və əlaqəli metodları əvəz edir. Məsələn, 3.x-də bu kod:

4.0-da yenidən yazmaq olar:

Eyni şəkildə, 3.x’in d3.time.weekOfYear yerinə, 4.0-da deyəcəksiniz:

Yeni interval.cont əlbəttə daha ümumi. Məsələn, istilik xəritəsi üçün həftənin saatını hesablamaq üçün istifadə edə bilərsiniz:

3.x-dən 4.0-a qədər olan bütün ekvivalentlər:

  • d3.time.dayOfYear ↦ d3.timeDay.count
  • d3.time.sundayOfYear ↦ d3.timeSunday.count
  • d3.time.mondayOfYear ↦ d3.timeMonday.count
  • d3.time.tuesdayOfYear ↦ d3.timeTuesday.count
  • d3.time.wednesdayOfYear ↦ d3.timeWednesday.count
  • d3.time.thursdayOfYear ↦ d3.timeThursday.count
  • d3.time.fridayOfYear ↦ d3.timeFriday.count
  • d3.time.saturdayOfYear ↦ d3.timeSaturday.count
  • d3.time.weekOfYear ↦ d3.timeWeek.count
  • d3.time.dayOfYear.utc ↦ d3.utcDay.count
  • d3.time.sundayOfYear.utc ↦ d3.utcSunday.count
  • d3.time.mondayOfYear.utc ↦ d3.utcBazar ertəsi.count
  • d3.time.tuesdayOfYear.utc ↦ d3.utcTesday.count
  • d3.time.wednesdayOfYear.utc ↦ d3.utcWednesday.count
  • d3.time.thursdayOfYear.utc ↦ d3.utcThursday.count
  • d3.time.fridayOfYear.utc ↦ d3.utcFriday.count
  • d3.time.saturdayOfYear.utc ↦ d3.utcşənbə.count
  • d3.time.weekOfYear.utc ↦ d3.utcWeek.count

D3 4.0 indi d3.timeInterval istifadə edərək xüsusi vaxt aralıqlarını təyin etməyə imkan verir. D3.timeYear, d3.utcYear, d3.timeMillisecond və d3.utcMillisecond intervalları tətbiqetmələri optimallaşdırmışdır interval.hər bir çox səmərəli çox böyük və ya çox kiçik sahələr üçün vaxt gənələri yaratmaq lazımdır. Daha ümumiyyətlə, vaxt aralığının performansı yaxşılaşdırılmışdır və zaman aralıkları, müxtəlif bölgələrdə gün işığına görə daha yaxşı bir iş görür.

D3 3.x-də bir taymeri dayandırmağın yeganə yolu, geri çağırmanın geriyə dönməsi idi. Məsələn, bu taymer bir saniyədən sonra dayanır:

Əsas faydası taymer.stop, taymerlərin öz-özünə xitam verməsi tələb olunmamasıdır: əlaqəli qaynaqların dərhal və sinxron atılmasına və narahatlıqların ayrılmasına imkan verən xaricdən dayandırıla bilər. Yuxarıda göstərilənlər bərabərdir:

Bu yaxşılaşma d3-keçidə qədər uzanır: indi bir keçid kəsildikdə, keçidin başlamasını gözləmək əvəzinə ehtiyatları dərhal azad olur.

4.0 ayrıca yenisini təqdim edir taymer. taymerlərin yenidən başlanması, işləyən taymerin geri çağırılmasının dəyişdirilməsi və ya gecikmə və ya istinad vaxtının dəyişdirilməsi üçün yenidən başlama metodu. Fərqli deyil taymer.stop, ardından d3.timer, taymer.restart mövcud sayğacın çağırma prioritetini qoruyur: aktiv taymerlərin çağırılma sırasının dəyişməməsinə zəmanət verir. D3.timer.flush metodu d3.timerFlush olaraq dəyişdirildi.

D3 3.x-dəki bəzi istifadə qaydaları, arxa plan səhifəsi ön plana qayıtdıqda brauzerin asılmasına səbəb ola bilər. Məsələn, aşağıdakı kod hər saniyə keçidi planlaşdırır:

Bu cür kod saatlarla arxa planda işləsə, səhifə ön plana çəkildiyi zaman minlərlə növbə keçid eyni vaxtda çalışmağa çalışacaqdır. D3 4.0, arxa planda vaxtı donduraraq bu asılmanın qarşısını alır: bir səhifə arxa planda olduqda, vaxt irəliləməz və beləliklə səhifə ön plana qayıdanda işləmək üçün heç bir taymer növbəsi yığılmır. Uzun müddət davam edən bir animasiya planlaşdırmaq üçün keçidlər əvəzinə d3.timer istifadə edin və ya keçidlərin arxa planda növbəyə girməməsi üçün setTimeout və setInterval yerinə d3.timeout və d3.interval istifadə edin:

Arxa planda vaxtı donduraraq, taymerlər arxa plana keçməyin təsirli bir şəkildə “xəbərsizdirlər”. Heç bir şey olmamış kimi! 4.0 ayrıca cari vaxtın d3.now olaraq mövcud olduğu yerlərdə yüksək dəqiqliklə (performance.now) vaxt istifadə edir.

The seçim.transition metodu artıq isteğe bağlıdır keçid mövcud keçidlə yeni bir keçidi sinxronlaşdırmaq üçün istifadə edilə bilən nümunə. (Bu dəyişiklik Proqram Təminatını Yaxşı edən Nədir? Daha ətraflı müzakirə olunur.) Məsələn:

Bu şəkildə yaradılan keçidlər zamanlamanı ən yaxın əcdad elementindən alır və beləliklə istinad edildikdə belə sinxronlaşdırılır keçid pilləli gecikmə kimi dəyişkən vaxta malikdir. Bu metod dərin sehrli davranışı əvəz edir keçid. 4.0-da 3.x-də, keçid.hər biri ilə eynidir seçim.hər biri. Yeni istifadə edin keçid. keçid hadisələrini dinləmək üsulu.

Mənası keçid.delay tərəfindən yaradılan zəncirli keçidlər üçün dəyişdi keçid. keçid. Göstərilən gecikmə indi ilə nisbətlidir əvvəlki zəncirdən daha çox keçid əvvəlcə zəncirdə keçid bu interstisial fasilələrin daxil edilməsini asanlaşdırır. Misal üçün:

Artıq vaxt arxa planda dondurulub Daha çox məlumat üçün d3-timer-ə baxın. Keçidlərin arxa planda işləməməsi əvvəllər olduğu kimi, indi səhifə ön plana döndükdə qaldıqları yerləri götürürlər. Bu, arxa planda məhdud sayda keçidi planlaşdırmamaqla səhifənin asılmasının qarşısını alır. Sonsuz təkrarlanan bir keçid planlaşdırmaq istəyirsinizsə, keçid hadisələrindən istifadə edin və ya setTimeout və setInterval əvəzinə d3.timeout və d3.interval istifadə edin.

The seçim.interrupt metodu artıq hər hansı bir aktiv keçidi dayandırmaqla yanaşı seçilmiş elementlərdəki bütün planlaşdırılmış keçidləri ləğv edir. Keçidlər kəsildikdə, keçidlə əlaqəli hər hansı bir qaynaq artıq keçid başlayana qədər gözləməkdən, performansı artırmaqdansa dərhal sərbəst buraxılır. (Həmçinin bax taymer.stop.) Yeni d3.interrupt metodu alternativdir seçim. bir nodu tez bir zamanda kəsmək üçün fasilə.

Yeni d3.active metodu verilmiş hal-hazırda aktiv keçidi seçməyə imkan verir düyün, varsa. Bu davam edən keçidlərin dəyişdirilməsi və sonsuz təkrarlanan keçidlərin planlaşdırılması üçün faydalıdır. Məsələn, bu keçid qırmızı ilə mavi arasında davamlı olaraq salınır:

Bir keçidin həyat dövrü indi daha formal olaraq müəyyənləşdirilir və tətbiq olunur. Məsələn, işləyən bir keçid müddətini dəyişdirməyə cəhd etmək, səssizcə uğursuz olmaqdansa bir səhv atır. The keçid.remove metodu birdən çox keçid adının istifadəsi halında düzəldilmişdir: element yalnız adından asılı olmayaraq planlı keçid olmadığı təqdirdə silinir. The keçid.ease metodu indi hər zaman bir sətir deyil, bir asanlaşdırma funksiyası alır. Bir keçid bitdikdə, tweens son dəfə çağırılır t əlaqəli asanlaşdırma funksiyasından asılı olmayaraq tam 1-ə bərabərdir.

4.0-dəki seçimlərdə olduğu kimi, artıq bütün keçid geri çağırma funksiyaları standart arqumentləri alır: elementin datum (d), elementin indeksi (mən) və element qrupu (qovşaqlar) ilə bu element kimi. Bu xüsusilə təsir göstərir keçid.attrTween və keçid.styleTween, artıq keçmir arada cari atributu və ya üslub dəyərini üçüncü arqument kimi işlədin. The keçid.attrTween və keçid.styleTween metodları artıq ayıklama və ya keçidlər arasındakı tərifləri paylaşmaq üçün getter rejimlərində çağırıla bilər.

Homojen keçidlər indi optimallaşdırılıb! Keçiddəki bütün elementlər eyni aranı, interpolatoru və ya hadisə dinləyicilərini paylaşırsa, bu vəziyyət hər element üçün ayrıca ayrılmaq əvəzinə keçid boyunca paylaşılır. 4.0 ayrıca, d3.interpolate for yerində optimallaşdırılmış standart interpolatordan istifadə edir keçid.attr və keçid. stil. Və keçidlər artıq həm CSS, həm də SVG çevrilmələrini interpolasiya edə bilər.

Balta kimi keçidləri dəstəkləyən yenidən istifadə edilə bilən komponentlər üçün yeni keçid.selection metodu müəyyən bir keçidə uyğun seçimi qaytarır. Yenisi də var keçid.merge metodu seçim.merge.

Parsimoniya naminə çox dəyərli xəritə metodları d3-selection-multi-ə çıxarıldı və artıq standart paketin hissəsi deyil. Çox dəyərli xəritə metodları, həddindən artıq yüklənməni azaltmaq üçün çoxluq şəklində də dəyişdirilmişdir: keçid.attrs və keçid. üslublar.

D3.geom.voronoi metodu d3.voronoi olaraq dəyişdirildi və voronoi.clipExtent metodunun adı dəyişdirildi voronoi.cərh. Sənədsiz çoxbucaqlı. girişdəki element olan 3.x-də nöqtə xassəsi məlumat çoxbucağa uyğun olaraq dəyişdirilib çoxbucaqlı.data.

Zəng voronoi indi topoloji məlumatları ehtiva edən tam Voronoi diaqramını qaytarır: hər Voronoi kənarı ifşa edir kənar.sol və kənar. kənarın hər iki tərəfindəki sahələri göstərən hüququ və hər Voronoi hüceyrəsi bu kənarların bir sıra və uyğun bir sahə olaraq təyin edilir. Voronoi diaqramı həm Voronoi həm də Delaunay tessellations-nı bir sıra nöqtələr üçün səmərəli hesablamaq üçün istifadə edilə bilər: diaqram.polygons, diaqram.bağlar və diaqram. üçbucaqlar. Yeni topologiya, TopoJSON ilə birlikdə Voronoi topologiyası nümunəsinə baxanda da faydalıdır.

The voronoi.polygons və diaqram.polygons artıq bir dərəcə tələb edir, artıq ± 1e6 qədər gizli bir dərəcə yoxdur. The voronoi.bağlar, voronoi. üçbucaqlar, diaqram.bağlar və diaqram. üçbucaqlar indi klip dərəcəsindən təsirlənir: Delaunay, Voronoyun ikili olaraq hesablandığı üçün, iki sayt yalnız kəsilmiş hüceyrələrə toxunduqda bir-birinə bağlanır. Delaunay üçbucağını kəsmə ilə əlaqəsiz hesablamaq üçün dərəcəni null olaraq təyin edin.

Voronoi generatoru nəhayət üst-üstə düşən zirvələr üçün yaxşı müəyyən edilmiş davranışa sahibdir: təsadüf nöqtələrinin birincisi müəyyən edilmiş bir hüceyrəyə, sonrakı təkrarlanan nöqtələrdə isə boş hücrələrə sahibdir. Geri qaytarılmış çoxbucaqlı sıra seyrəkdir, buna görə istifadə edin massiv.hər biri üçün massiv.map, asanlıqla təyin olunmamış hüceyrələri atlaya bilərsiniz. Voronoi generatoru artıq hüceyrə kənarlarının ölçüləri ilə kəsişməməsi vəziyyətini düzgün şəkildə idarə edir.

D3.behavior.zoom zoom davranışı d3.zoom olaraq dəyişdirildi. Zoom davranışları artıq aktiv zoom çevrilməsini saxlamır (yəni, görünən bölgə miqyası və tərcümə) daxilində. Zum çevrilməsi artıq zoom davranışının tətbiq olunduğu bütün elementlərdə saxlanılır. Zum çevrilməsi mövcuddur hadisə.yaxınlaşdırma hadisəsi daxilində və ya verilmiş bir d3.zoomTransform çağıraraq çevrilir element. Proqramlaşdıraraq böyütmək üçün istifadə edin böyüdünmüəyyən bir seçim və ya keçid ilə .transformasiya zoom keçidləri nümunəsinə baxın. The böyüdün.event metodu silindi.

Proqramlı yaxınlaşdırmanı asanlaşdırmaq üçün bunun üstündə bir neçə yeni rahatlıq üsulu var böyüdün.transform: böyüdün.translateBy, böyüdün.miqyaslı və böyüdün.şəkil. Zoom çevrilmələrini təsvir etmək üçün yeni bir API var. Zoom davranışları artıq tərəzilərdən asılı deyil, ancaq istifadə edə bilərsiniz çevirmək.rescaleX, çevirmək.rescaleY, çevirmək.invertX və ya çevirmək. bir tərəzinin domenini çevirmək üçün. 3.x hadisə.miqyas ilə əvəz olunur hadisə.transform.k və hadisə.translate ilə əvəz olunur hadisə.transform.x və hadisə.transform.y. The böyüdün.center metodu proqramatik yaxınlaşma lehinə silindi.

Zum davranışı nəhayət panning sadə məhdudiyyətlərini dəstəkləyir! Yeni böyüdün.translateExtent dünyanın görünə bilən dərəcəsini təyin etməyə imkan verir: hazırda görünən dərəcə (görünüş sahəsinin ölçüsü, böyüdün.extent) həmişə tərcümə dərəcəsi daxilindədir. The böyüdün. ölçüsü metodu ilə əvəz edilmişdir böyüdün.extent və varsayılan davranış indi daha ağıllıdır: 960 × 500 olaraq kodlaşdırılmaqdansa, zoom davranışının sahibi elementinin ölçüsündə standartdır. (Bu da hamar zoom keçidləri zamanı seçilən standart yolu yaxşılaşdırır!)

Zum davranışının qarşılıqlı əlaqəsi də yaxşılaşmışdır. İndi paralel təkərləmə və sürüşmə, eyni zamanda toxunma və siçan vurmağı düzgün şəkildə idarə edir. Böyütmə davranışı artıq təkər hadisələrini miqyas sərhədləri daxilində görməməzliyə vurur və böyüdülən bir sahədən keçməyə imkan verir. The zoomstartzoomend tədbirlərin adı dəyişdirildi başlamaqson. Varsayılan olaraq, böyüdücü davranışlar indi kontekst menyusunun istifadəsi üçün nəzərdə tutulmuş sağ vuruşları görməzlikdən gəlir böyüdün.hansı hadisələrin laqeyd qaldığını idarə etmək üçün süzgəc. Böyütmə davranışı, iOS-dakı süni siçan hadisələrini də nəzərə almır. Böyütmə davranışı artıq idarə olunan hadisələri istehlak edir və sürükləmək kimi digər interaktiv davranışlarla birləşməyi asanlaşdırır.