Qualcuno sa come visualizzare un'immagine in scala di grigi, ovvero una matrice 2-D di intensità di pixel, utilizzando d3? Non riesco a trovare alcun esempio di esso ovunque, sarà difficile? Qualsiasi aiuto/link/suggerimenti apprezzato!D3: visualizzazione dell'immagine in scala di grigi guidata da dati di array 2D
risposta
Se si desidera solo visualizzare un'immagine, utilizzare lo image element e l'attributo "xlink: href". Per esempio:
svg.append("image")
.attr("xlink:href", "my.png")
.attr("width", 960)
.attr("height", 500);
Se si desidera colorare un'immagine in scala di grigi, poi vedono questo colorized heightmap example che utilizza quantili per creare una scala di colori divergenti, e con HCL interpolazione per una migliore percezione:
Se hai i tuoi dati in qualche altra rappresentazione, questi esempi potrebbero essere utili:
Infine, se si dispone di singoli campioni, piuttosto che un istogramma 2D precalcolate, avrete bisogno di bin i dati prima di generare una delle mappe di calore di cui sopra.
Molto bello, grazie per le informazioni. La heightmap è un bell'esempio di cosa stavo mirando. Fondamentalmente ho un array python 2-d con cui sto lavorando. Grazie per aver fornito d3 Michael! – reptilicus
Una domanda, perché l'immagine su http://bl.ocks.org/3074470 è liscia e non troppo pixelata. – reptilicus
Si prega di contrassegnare questa domanda come accettata se ho risposto alla tua domanda. Per la tua seconda domanda, l'immagine è liscia perché il browser ricampiona la tela (come qualsiasi altra immagine) quando viene visualizzata con una risoluzione non nativa. Potresti essere in grado di controllare questo comportamento tramite la proprietà di stile [image-rendering] (https://developer.mozilla.org/en-US/docs/CSS/Image-rendering). – mbostock
- 1. Visualizzazione di un'immagine in scala di grigi
- 2. iterazione array scala 2d
- 3. Copia profonda di array 2D in Scala?
- 4. UIView in scala di grigi. Visualizzazione non essere ridisegnato
- 5. Rimozione di valori anomali da un'immagine in scala di grigi
- 6. Converti un'immagine in scala di grigi
- 7. Google Maps in scala di grigi
- 8. 16 bit in scala di grigi png
- 9. Converti una QImage in scala di grigi
- 10. Jet colormap in scala di grigi
- 11. Mostra array 2D da OpenCV in Matplotlib.pyplot.imshow()
- 12. Rotazione numpy array 2D
- 13. Visualizzazione dell'immagine in scala di grigi a 16 bit in WPF
- 14. Produzione di array 2D da un array 1D in MATLAB
- 15. Converti binario in scala di grigi crudo in JPEG
- 16. 2d array di zeri
- 17. convertire RGB in scala di grigi in C
- 18. Android jpeg pictureCallback in scala di grigi Opencv Mat
- 19. Come rendere grata xyplot() in scala di grigi in R?
- 20. Come convertire un'immagine in scala di grigi in reagire nativo?
- 21. Determina se un'immagine è in scala di grigi in Matlab
- 22. Fai simboli emoji in scala di grigi in UILabel
- 23. Creare un vero PNG in scala di grigi in PHP
- 24. come implementare il rendering in scala di grigi in OpenGL?
- 25. Unione di due array di numpy 2D in un singolo array 2D di 2 tuple
- 26. Rilevamento delle immagini in scala di grigi con .Net
- 27. Libreria di animazioni Scala 2D
- 28. convertire jpg in scala di grigi csv utilizzando R
- 29. Slice array 2d in array 2d più piccoli
- 30. Istogrammi di dispersione 2D e 3D da array in Python
Sembra una mappa termica –
Sì, qualcosa del genere. Vedo alcuni link a d3 heatmaps, ma non immagini chiare finora. Sono un po 'sorpreso. . . – reptilicus
Cosa intendi per "semplice immagine"? –