SVGQuartet d'AnscombeMarkdownIntroduction à D3Graphiques en bâtonsD3 - Joindre des données à des élémentsTypes de visualisation de donnéesStructures de données javascriptFonctions RamdaD3 - définir les axesD3-shapeReprésenter un réseau avec D3Données cartographiquesLa cartographie avec D3Leaflet et fonds de carte en tuilesCanvasGraphiques camembertTransitions avec D3BillboardApprentissage automatiqueTopojsonObservableD3 hierarchy / treeTrouver des coordonnéesLeaflet et D3
Méthodes sur une liste (Array)
fruits = ([
{name: 'Pomme', num: 5},
{name: 'Pêche', num: 3 },
{name: 'Banane', num: 6}
])
fruits.map(() => `Rien à voir`)
fruits.map(fruit => `J'ai ${fruit.num} ${fruit.name}s`)
fruits.map((fruit, i) => `L'index est ${i}`)
fruits.map((fruit, i) => `La ${fruit.name} est à l'index ${i}`)
commenceParP = fruit => fruit.name.startsWith('P')
fruits.map(fruit => `${fruit.name} commence par P: ${commenceParP(fruit)}`)
fruits.filter(commenceParP)
fruits.filter((fruit, i) => i < 2)
fruits.find(commenceParP)
commenceParZ = fruit => fruit.name.startsWith('Z')
fruits.find(commenceParZ)
chiffres = [6, 3, 5, 8]
sum = (resultat, chiffre) => resultat + chiffre
chiffres.reduce(sum, 0)
fruits.reduce((resultat, d) => resultat + d.num, 0)
VALEUR_DE_DEPART = ({ p: [], autres: [] })
separerLesFruitsQuiCommencentParP = ({ p, autres }, d) =>
// la fonction commenceParP retourne "true" ou "false"
commenceParP(d)
// si "true", ajouter "d" à la liste "p"
? { p: [...p, d], autres }
// si "false", ajouter "d" à la liste "autres"
: { p, autres: [...autres, d] }
fruits.reduce(separerLesFruitsQuiCommencentParP, VALEUR_DE_DEPART)
[1, 2, 3].includes(2)
[1, 2, 3].includes(4)
['c', 'd', 'b', 'a'].sort()
[12, 2, 1, 23].sort()
[12, 2, 1, 23].sort((a, b) => a > b ? 1 : -1)
[12, 2, 1, 23].sort((a, b) => a > b ? -1 : 1)
fruits.sort((a, b) => a.num > b.num ? -1 : 1)
fruits.map(d => d.name).join('----')
fruits.map(d => d.name).join('\n')
[1, 2, 3].join(' + ')
fruits.join('.')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
