Spaces:
Running
Running
File size: 1,873 Bytes
40559c4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
var lURLs = `
img/green_doctor.png
img/blue_doctor.jpg
img/green0.png
img/bright_blue.png
img/blue0.png
img/blue1.png
`.trim().split('\n')
var rURLs = `
img/white0.png
img/white1.png
img/white2.png
img/white3.png
img/white4.png
img/white5.png
`.trim().split('\n')
var constructionSel = d3.select('#construction')
.html('')
// constructionSel.append('div.top').each(function(){
// var metrics = [{str: 'Male', key: 'Male', target: .5}]
// var active ={ percents: {Male: .5}}
// addMetrics(metrics, {topSel: d3.select(this).append('div.top'), active, isSmall: true})()
// })
constructionSel.append('img')
.at({src: 'img/construction.jpg', width: 900})
constructionSel.append('div')
.st({fontWeight: 500, fontSize: 14})
.text('Stock “construction worker” images')
var width = 400
var coatDivs = d3.select('#coat-v-gender').html('').st({marginBottom: 40})
.appendMany('div', [lURLs, rURLs])
.st({width: width, display: 'inline-block', marginRight: 20})
coatDivs.each(function(d, i){
var metrics = [
{str: 'Blue', key: 'Blue', target: .5},
{str: 'Male', key: 'Male', target: .5},
]
var active = !i ? {percents: {Blue: .5, Male: 1}} : {percents: {Blue: 0, Male: .5}}
addMetrics(metrics, {topSel: d3.select(this).append('div.top'), active, isSmall: true})()
})
coatDivs
.st({fontWeight: 500, fontSize: 14})
.appendMany('div', d => d.slice(0, 6))
.st({backgroundImage: d => 'url(' + d + ')', width: width/3 - 10, height: 100, display: 'inline-block'})
.st({marginRight: 8, outline: '1px solid #000'})
coatDivs
.append('div')
.text((d, i) => d == lURLs ? 'Male-presenting doctors wearing different colored clothes' : 'Doctor of different genders wearing white clothes')
// https://t3.gstatic.com/images?q=tbn:ANd9GcRziJdedqu58HeAlI9xtWhrVtCjVo6xO_uSHdQkxAI0q41XozLWT3xKd36S1NbuSoIOVvV4Huw26zAvdM_374qKuN9J88E |