Liste der d3-Symbole zur Verfügung, die uns
Wo finde ich die Liste der Symbole, die uns zur Verfügung gestellt von d3.js verwiesen wird, die von dieser code-Zeile:
d3.svg.symbol().type(/*Name of the symbol type that is available to us to use*/'triangle')
Einige der verfügbaren Symbole sind Dreieck, Diamant. Gibt es eine Dokumentation zur Verfügung, überall dort, wo die gesamte Liste dokumentiert ist.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Die unterstützte Typen sind aufgelistet in der D3-Dokumentation: https://github.com/mbostock/d3/wiki/SVG-Shapes#symbol_type. Zitat:
D3 hat auch ein Objekt, in dem die Symbole zur Verfügung (vielen Dank nochmal, @jshanley). E. g. für D3 3.4.6:
d3.svg.symbolTypes
gibt ein array von Typen unterstützt, die in Ihrer version von d3.Sich für die version 4, es sind sieben Formen, im Gegensatz zu den sechs in der version 3 (auf die in der anderen Antwort).
Den Formen enthalten sind, in das array
d3.symbols
enthält:d3.symbolCircle
d3.symbolCross
d3.symbolDiamond
d3.symbolSquare
d3.symbolStar
(neu in version 4)d3.symbolTriangle
(es gibt nur ein Dreieck in v 4, verglichen mit 2 in v3)d3.symbolWye
(a 'y" - förmigen symbol, neu in version 4)Den d3-Dokumentation wie üblich deckt das Thema auch hier.
Zeigen die Symbole, und zeigen Sie, wie der array kann verwendet werden, um Formen dynamisch, ich habe schonmal ein snippet unter:
JS:
HTML:
function(d,i)
in einer Auswahl wie dieser, auf den Sie zugreifen, das datum und die Schrittweite, die mit jedem element in der Auswahl. Also in der ersten Zeile das symbol positioniert ist 30 Pixel nach unten, und i*20+20 pixel von Links. Die zweite Zeile gibt eine d3 symbol geben, alsd3.symbols
ist ein array, können wir die Schrittweite, um ein bestimmtes symbol.var svg = d3.select('svg').attr('width',400).attr('height',200); svg.append('path') .attr('transform','translate(50,80)') .attr('d', d3.symbol().type( function(d) { return d3.symbols[2];}) )
und auch ich bin versucht zu erstellen, drag & drop auf das symbol können Sie mir helfen mit dem Ansatz?d3.select('body').append('svg')
könnte das sein, was Sie beabsichtigen. Wie bei drag-and-drop, das ist zu viel für einen Kommentar, und zu Verschieden von der Frage Hinzugefügt werden, um die Antwort. Es könnte bereits existieren, als eine Frage, oder es muss gefragt werden, wie man.