Html 是否使用下拉菜单中的选定颜色选项更新地图多边形和地图图例？

我是一个新手程序员，试图用d3制作一个交互式地图。到目前为止，我已经能够通过从下拉菜单中选择Colorbrewer CSS颜色方案来更新SVG choropleth（分位数）贴图中多边形的颜色

d3.select("select#ColorSelection")
    .on("keyup", function() {d3.selectAll("svg#Mapsvg").attr("class", this.value)})
    .on("change", function() {d3.selectAll("svg#Mapsvg").attr("class", this.value)});    

但是，无论在下拉菜单中选择了什么其他颜色方案选项，地图图例的颜色框都会固定在蓝色方案上。这是一个例子。我尝试过一些事情，比如添加额外的代码，简单地复制上面的代码，但用地图图例“svg#Legendsvg”替换“svg#Mapsvg”，但没有任何运气

如何使用从下拉菜单中选择的相同颜色方案更新地图图例（“svg#Legendsvg”）和地图本身

如果我错过了一些非常基本的东西，请提前道歉。谢谢你能提供的任何帮助

以下是地图图例颜色框的代码，供参考：

var legends = d3.select('svg#Legendsvg')
var legendbars = legends.selectAll('rect')
        .data(legend)
        .enter()
        .append('rect')
        .attr('x', 5)
        .attr('y', function(d, i) {return (i*30)+25})
        .attr('height',28)
        .attr('width',30)
        .attr('class', function (d) {return quants(d)} )
        ;

和下拉菜单的参考代码：

    <p>Color Scheme: 
        <select id="ColorSelection">
        <option value="Blues" selected>Blues</option>
        <option value="Greys">Greys</option>
        <option value="Greens">Greens</option>
        <option value="Oranges">Oranges</option>
        <option value="Reds">Reds</option>
        <option value="Purples">Purples</option>
        <option value="YlGn">Yellow-Green</option>
        <option value="YlGnBu">Yellow-Green-Blue</option>
        <option value="GnBu">Green-Blue</option>
        <option value="BuGn">Blue-Green</option>
        <option value="PuBuGn">Purple-Blue-Green</option>
        <option value="PuBu">Purple-Blue</option>
        <option value="BuPu">Blue-Purple</option>
        <option value="RdPu">Red-Purple</option>
        <option value="PuRd">Purple-Red</option>
        <option value="OrRd">Orange-Red</option>
        <option value="YlOrRd">Yellow-Orange-Red</option>
        <option value="YlOrBr">Yellow-Orange-Brown</option>
        </select></br>

配色方案：
忧郁
灰色
果岭
橘子
红色
紫色
黄绿
黄绿蓝
青蓝色
蓝绿色
紫蓝绿
紫蓝色
蓝紫色
红紫色
紫红色
橙红色
黄橙红
黄橙棕

您似乎并没有实际为图例栏指定一个id值

Legendsvg

。因此，如果您尝试使用#Legendsvg d3进行选择，将无法获得您尝试选择的元素。尝试添加

.attr(id, "Legendsvg")

添加到图例创建语句，然后编辑键控/更改功能以：

{d3.selectAll("svg#Mapsvg, svg#Legendsvg")...