小编bai*_*ley的帖子

我有一张显示总人口的美国等值地图.我想在地图上添加一个图例来显示分位数范围值.我已经看到了关于这个主题的其他类似问题,但似乎无法让它适用于我的特定情况.我知道我需要包含颜色范围或颜色域,但不确定这是否正确.截至目前,图例中只显示了一个功能,可能是所有图例功能都叠加在一起.我怎么知道,我该如何解决这个问题.

//Define default colorbrewer scheme
var colorSchemeSelect = "Greens";
var colorScheme = colorbrewer[colorSchemeSelect]; 

//define default number of quantiles
var quantiles = 5;

//Define quantile scale to sort data values into buckets of color
var color = d3.scale.quantile()
   .range(colorScheme[quantiles]);

d3.csv(data, function (data) {
    color.domain([
         d3.min(data, function (d) {
           return d.value;
         }),
         d3.max(data, function (d
           return d.value
         }) 
    ]);

//legend                            
var legend = svg.selectAll('rect')
    .data(color.domain().reverse())
    .enter()
    .append('rect')
    .attr("x", width - 780)
    .attr("y", function(d, i) {
       return i * 20;
    })
   .attr("width", 10) …

首先,我想知道是否有人知道D3示例显示带错误条的分组条形图？我发现的最接近的事情是:

http://tenxer.github.io/xcharts/examples/(示例自定义Vis类型:误差线) http://bl.ocks.org/chrisbrich/5044999(点数的误差线)

我有一个分组条形图的工作示例,我想在显示MOE的图表中为每个条形添加一个错误栏.我需要采取哪些步骤才能实现这一目标？我该如何计算线的位置？这是我认为需要做的,请帮我填写我需要采取的步骤.

1. 创建一个SVG行

2. 通过取d.value的d3.max + MOE和d3.max的d.value - MOE来计算线的ymin和ymax.

3. 附加

这不起作用,但它是在正确的轨道上？

var line = d3.svg.line()
    .x(function(d) {return x(d.state); })
    .y0(function(d) {return y(d.value - d.moe); })
    .y1(function(d) {return y(d.value + d.moe); })
    .interpolate("linear");

var errorBarSVG = d3.select("body").append("svg")

var errorBar = errorBarSVG.append("path")
    .attr("d", line(data))
    .attr("stroke", "red")
    .attr("stroke-width", 1.5);

我需要用D3.js制作一个经典的人口金字塔.与此图像类似的东西:

我发现了一些看起来非常好的例子(这个和这个),但它们比我正在寻找的更复杂.有谁知道我能看到的一个很好的SIMPLE例子？有什么建议吗？我应该只是制作两个彼此相邻的条形图,每个性别组一个吗？

我希望Leaflets 图层控件功能使用的图层名称来自变量而不是字符串,并且基于图层中的数据.

下面显示的示例使用变量layerName.这是否可能,因为它期待一个名称值对？有工作吗？

var layerName = feature.properties.condition[0];

//layer control
var baseMaps = {
    "OpenStreetMap": OSM,
    "Aerial Imagery": MapQuestOpen_Aerial
};

var overlayMaps = {
    layerName: layer1,

};

L.control.layers(baseMaps, overlayMaps).addTo(map);