Guildhouse = {
const width = 1920,
height = 1080;
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, height]);
var p = svg.selectAll("polyline")
if(guildbutton =="on"){
p.enter().append("polyline")
.data(mainoutline)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.75')
}
if(guildbutton =="on"){
p.enter().append("polyline")
.data(maininside)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.25')
}
if(stonebutton =="on"){
p.enter().append("polyline")
.data(stoneinside)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.75')
}
/////////////////////////////////////////////////
if (stonebutton=="on"){
p.enter().append("polyline")
.data(stonecombined)
.enter()
.append("polyline")
.attr('points',function(d){return d.geo})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.1')
.on('mouseover',stonedata)
.on('mouseout',stonedataout)
}
/////////////////////////////////////////////////
if(copperbutton =="on"){
p.enter().append("polyline")
.data(copperinside)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.25')
}
/////////////////////////////////////////////////
if (copperbutton=="on"){
p.enter().append("polyline")
.data(coppercombined)
.enter()
.append("polyline")
.attr('points',function(d){return d.geo})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.1')
.on('mouseover',copperdata)
.on('mouseout',copperdataout)
}
/////////////////////////////////////////////////
if(slatebutton =="on"){
p.enter().append("polyline")
.data(slateinside)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.25')
}
/////////////////////////////////////////////////
if(slatebutton =="on"){
p.enter().append("polyline")
.data(slateoutline)
.enter()
.append("polyline")
.attr('points',function(d){return d})
.style('fill','none')
.style('stroke','black')
.style('stroke-width','.75')
}
/////////////////////////////////////////////////
svg
.append("text")
.attr('x','50')
.attr('y','800')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('part:')
svg
.append("text")
.attr('x','50')
.attr('y','825')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('Material:')
svg
.append("text")
.attr('x','50')
.attr('y','850')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('part:')
svg
.append("text")
.attr('x','50')
.attr('y','875')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('age:')
svg
.append("text")
.attr('x','50')
.attr('y','900')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('origin:')
svg
.append("text")
.attr('x','50')
.attr('y','925')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text('fabricator:')
/////////////////////////////////////////////////
function stonedata(event,d){
svg
.append("text")
.attr('x','130')
.attr('y','800')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.part)
svg
.append("text")
.attr('x','130')
.attr('y','825')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.materials)
svg
.append("text")
.attr('x','130')
.attr('y','850')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.part)
svg
.append("text")
.attr('x','130')
.attr('y','875')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.age)
svg
.append("text")
.attr('x','130')
.attr('y','900')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.origin)
svg
.append("text")
.attr('x','150')
.attr('y','925')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.fabricator)
svg
.append("text")
.attr('x','175')
.attr('y','950')
.attr('class','stonetext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.transportation)
d3.select(this).style('fill','brown')
}
function stonedataout(){
d3.selectAll('text.stonetext').remove()
d3.selectAll('line.hoverline').remove()
d3.select(this).style('fill','white')
}
/////////////////////////////////////////////////
function copperdata(event,d){
svg
.append("text")
.attr('x','130')
.attr('y','800')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.part)
svg
.append("text")
.attr('x','130')
.attr('y','825')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.materials)
svg
.append("text")
.attr('x','130')
.attr('y','850')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.part)
svg
.append("text")
.attr('x','130')
.attr('y','875')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.age)
svg
.append("text")
.attr('x','130')
.attr('y','900')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.origin)
svg
.append("text")
.attr('x','150')
.attr('y','925')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.fabricator)
svg
.append("text")
.attr('x','175')
.attr('y','950')
.attr('class','coppertext')
.style('font-family','helvetica')
.style('font-size','1em')
.style('font-weight','bold')
.style("fill","rgb(0,0,0)")
.text(d.data.transportation)
d3.select(this).style('fill','turqouise')
}
function copperdataout(){
d3.selectAll('text.coppertext').remove()
d3.selectAll('line.hoverline').remove()
d3.select(this).style('fill','white')
}
/////////////////////////////////////////////////
return svg.node();
}