różnica między funkcją (d) i funkcją (d, i)?

Każdy musi przejść przez tę myśl, jestem tego pewien.różnica między funkcją (d) i funkcją (d, i)?

Jestem w pobliżu tej rzeczy już od kilku godzin !!!! Ale nie wiem jak z niej korzystać i jaka jest różnica między nimi różnica?

function(d){return d} 

function(d,i){return d and some more custom code}

przykładzie --->

var danych = [4, 8, 15, 16, 23, 42];

Function(d)::::: 

    chart.selectAll("div") 
     .data(data) 
     .enter().append("div") 
     .style("width", function(d) { return d * 10 + "px"; }) 
     .text(function(d) { return d; }); 

    ------------------------------------------------------------------------------------ 

Function(d*i)::::: 

    chart.selectAll("rect") 
     .data(data) 
     .enter().append("rect") 
     .attr("y", function(d, i) { return i * 20; }) 
     .attr("width", x) 
     .attr("height", 20);

Źródło

2013-06-27 Anonymous

Cóż, robią różne rzeczy? Jeśli nie powiesz nam o kontekście, w którym są używane (przykład połączenia), nie będziemy w stanie wyjaśnić wiele? – Bergi

Jestem zadając ogólne pytanie !!! Wystarczy małe podstawowe wyjaśnienie na przykładzie. Przeszukałem programy, w których często to widzę. Zasadniczo podstawowe wytłumaczenie ogólne to zrobi !!! –

Cóż, ogólna odpowiedź brzmi, że druga funkcja wykonuje więcej niż pierwsza. Jeśli nie powiesz nam * gdzie * w niektórych programach widziałeś to, nie możemy zrobić lepiej (lub zgadnąć jak nnnnn poniżej) – Bergi

Twój przykład jest dobry rysownik różnicy między nimi.

W pierwszym przykładzie użyto tylko d. d reprezentuje dane powiązane z danym wyborem. W tym przypadku, tworzony jest szereg wybranych div, po jednym dla każdego elementu macierzy data:

chart.selectAll("div") 
    .data(data) 
    .enter() 
    .append("div")

To nie tylko tworzy tablicę div elementów, ale łączy dane z każdego z tych elementów. Odbywa się to w trybie jeden do jednego, z każdym z nich div odpowiadającym pojedynczemu elementowi w macierzy data. Jeden jest powiązany z "4", jeden z "8" i tak dalej.

Gdybym następnie przejść do korzystania .text(function(d){...}) na tablicy wyborów, d będzie odnosić się do danych skojarzonych z każdym wybranym div, więc jeśli mogę użyć następującą metodę na moich wyborów:

.text(function(d) { return d; });

Każdy z mój div s będzie zawierał tekst, którego wartość to d lub dane powiązane z tym elementem.

Gdy tworzona jest tablica selekcji, otrzymują również indeks w tablicy. W twoim przykładzie odpowiada to pozycji ich danych w tablicy danych. Jeśli twoja funkcja żąda zarówno d jak i i, wtedy i będzie odpowiadać temu indeksowi. Wracając do naszego div s, div powiązany z "4" będzie miał indeks "0", "8" będzie miał indeks "1", i tak dalej.

Należy również pamiętać, że znak używany w żądanej zmiennej nie ma znaczenia. Pierwsza zmienna w wywołaniu funkcji to zawsze dane, a druga to indeks. Jeżeli użyłem metody jak

.text(function(cat,moose){ return("data is: " + cat + " index is: " + moose)})

cat będą zgodne z danymi zaznaczenia i moose będzie odpowiadać indeksu.

Źródło

2013-06-27 14:04:13 ckersch

Bardzo dobra i miła odpowiedź! – Naxos84

Jeśli mówimy o funkcji zwrotnych chcesz przekazać do metody jak .attr(), wówczas funkcja jest wywoływana dla każdego elementu w bieżącym zaznaczeniu, gdzie i daje indeks bieżącego elementu, ale w zależności od tego, co robisz, możesz nie dbać o indeks. Więc chociaż D3.js zawsze wywoła twoją funkcję z obydwoma argumentami, jeśli nie potrzebujesz drugiego argumentu w konkretnym przypadku, twoja funkcja nie musi jawnie deklarować tego.

JavaScript umożliwia wywoływanie dowolnej funkcji z dowolną liczbą argumentów, niezależnie od tego, ile zostało jawnie zawartych w deklaracji funkcji. Jeśli wywołasz funkcję z mniejszą liczbą argumentów niż zdefiniowano, resztki otrzymają wartość undefined. Jeśli wywołasz funkcję o większej liczbie argumentów, niż zdefiniowano, nadal możesz uzyskać dostęp do dodatkowych z funkcji za pomocą arguments object - lub możesz je zignorować.

. (Uwaga: należy mieć małymi literami f w function())

Źródło

2013-06-27 12:44:10 nnnnnn

Mam nadzieję, że ten przykład może ci pomóc. Jest to kompletna strona internetowa, gdzie można rozpocząć gry:

<!doctype html> 
<meta charset="utf-8"> 
<title>my first d3</title> 
<body> 

<script> 
    var data=[10,20,30,40]; 

    var lis = d3.select("body") 
       .append("ul") 
       .selectAll("li") 
       .data(data) 

    lis.enter() 
    .append("li") 
    .text(function(d,i){ return "item n° "+i+" has value: "+d}) 
</script>

Zasadniczo d jest wartość danych, a i jest jego indeks. Możesz zobaczyć ten przykład tutaj: http://jsfiddle.net/M8nK8/

Źródło

2013-06-27 16:32:21

Awans na Twój wysiłek !!! thanx –

różnica między funkcją (d) i funkcją (d, i)?

Odpowiedz

Powiązane problemy