Question

我有非常简单的yscale函数，但我的许多元素都大于范围。（即它们超过了svg高度的大小。

 var yScale = d3.scaleLinear()
     .domain([0, d3.max(tempDataset)])
     .range([0, h]);

 selection.attr("x", function(d, i) {
         return xScale(i);
     })
     .attr("y", function(d) {
         return h - yScale(d);
     })
     .attr("width", xScale.bandwidth() - barPadding)
     .attr("height", function(d) {
         return yScale(d);
     })

数据：

1.  (38) ["1975", "1976", "1977", "1978", "1979", "1980", "1981", "1982", "1983", "1984", "1985", "1986", "1987", "1988", "1989", "1990", "1991", "1992", "1993", "1994", "1995", "1996", "1997", "1998", "1999", "2000", "2001", "2002", "2003", "2004", "2005", "2006", "2007", "2008", "2009", "2010", "2011", "2012"]
2.  1:(38) ["331390", "340345", "347538", "363169", "361749", "370099", "376172", "376525", "379967", "388659", "392718", "399108", "412522", "422647", "424124", "427239", "434253", "438543", "445772", "449440", "459455", "462188", "464193", "473811", "479474", "489656", "496929", "504601", "508071", "511140", "512445", "512277", "508164", "511145", "517763", "527278", "542753", "549659"]
3.  2:(38) ["48", "29", "46", "47", "36", "54", "61", "5", "34", "41", "41", "5", "46", "43", "47", "37", "28", "27", "49", "24", "37", "35", "26", "15", "15", "22", "22", "34", "47", "31", "31", "45", "39", "35", "31", "36", "28", "24"]
4.  3:(38) ["223", "226", "34", "187", "232", "316", "226", "22", "187", "25", "288", "333", "279", "196", "292", "307", "29", "31", "316", "294", "242", "186", "194", "247", "244", "239", "239", "186", "183", "215", "172", "215", "177", "213", "183", "214", "168", "182"]
5.  4:(38) ["1246", "97", "1139", "961", "832", "951", "1297", "1115", "1224", "107", "1062", "925", "928", "994", "1103", "1081", "1481", "1494", "1451", "154", "1661", "1668", "1249", "1332", "1128", "1319", "1481", "1494", "1482", "1501", "1688", "1841", "1791", "1585", "1441", "1254", "110", "979"]
6.  5:(38) ["4569", "1819", "1888", "1955", "2012", "2202", "218", "2242", "2461", "2792", "3066", "2453", "217", "2307", "211", "238", "2457", "2684", "3127", "2864", "2353", "2741", "305", "3826", "4499", "533", "590", "5434", "5182", "4701", "4289", "4082", "403", "3901", "3984", "4053", "3633", "2965"]
7.  6:(38) ["6086", "3044", "3413", "315", "3113", "3523", "3764", "3628", "3906", "4153", "4456", "3761", "3423", "354", "3553", "3806", "4256", "4515", "4944", "4721", "4292", "463", "452", "542", "5886", "6911", "7643", "7148", "6895", "6448", "618", "6182", "6037", "5734", "564", "5557", "4929", "415"]
8.  7:(38) [1, "50", "121", "77", "12", "132", "68", "36", "77", "63", "73", "156", "9", "34", "04", "71", "118", "61", "95", "45", "91", "79", "24", "199", "86", "174", "106", "65", "35", "65", "42", "0", "23", "5", "16", "15", "113", "158"]
9.  8:(38) ["17086", "13671", "14649", "12925", "12246", "1471", "13571", "12254", "11559", "10984", "11904", "13485", "11003", "9781", "9452", "10133", "9808", "9589", "9038", "8108", "7613", "8661", "8223", "744", "7289", "6427", "6452", "6324", "6115", "5842", "6092", "6676", "6714", "6689", "5924", "5424", "4162", "4703"]
10. 9:(38) ["38432", "33892", "31027", "27866", "29393", "33005", "33596", "30986", "26494", "26067", "2445", "28311", "28304", "27392", "27452", "29136", "31553", "31101", "29775", "2955", "30547", "31228", "30278", "28349", "27987", "2737", "27664", "26756", "26048", "24242", "23979", "23848", "26163", "2798", "2465", "2225", "20993", "20556"]
11. 10:(38) ["5993", "4466", "4132", "3197", "3494", "3656", "3392", "2996", "2503", "2421", "2854", "3841", "4063", "4261", "4256", "5142", "4799", "4791", "4159", "4018", "4055", "3888", "3792", "3227", "2957", "2855", "2532", "2941", "2836", "3191", "2974", "3229", "328", "3093", "219", "2344", "1533", "1616"]
12. 11:(38) ["61511", "5203", "49808", "43988", "45134", "5137", "50559", "46236", "40556", "39472", "39209", "45637", "4337", "41434", "4116", "44411", "4616", "4548", "42973", "41676", "42215", "43777", "42293", "39016", "38234", "36652", "36647", "36021", "34999", "33275", "33045", "33753", "36158", "37762", "32764", "30018", "26688", "26875"]
13. 12:(38) [1, "154", "43", "117", "26", "138", "16", "86", "123", "27", "07", "164", "5", "45", "07", "79", "39", "15", "55", "3", "13", "37", "34", "77", "2", "41", "0", "17", "28", "49", "07", "21", "71", "44", "132", "84", "111", "07"]
14. 13:(38) ["67597", "55074", "5322", "47138", "48246", "54893", "54324", "49864", "44462", "43624", "43665", "49398", "46793", "44974", "44713", "48217", "50415", "49995", "47917", "46398", "46507", "48407", "46812", "44435", "44119", "43563", "4429", "43169", "41894", "39723", "39226", "39935", "42195", "43496", "38404", "35575", "31617", "31025"]
15. 14:(38) [1, "185", "34", "114", "24", "138", "1", "82", "108", "19", "01", "131", "53", "39", "06", "78", "46", "08", "42", "32", "02", "41", "33", "51", "07", "13", "17", "25", "3", "52", "13", "18", "57", "31", "117", "74", "111", "19"]

行号（不是索引号）4,5,6,8,9,13,15所有比例都不正确。其他人不是问题。

Answer 1

编辑完成后，问题变得非常明确：您使用的是字符串，而不是数字。

当一个人使用字符串而不是数字时，许多事情都会中断，其中包括计算最大值（使用Math.max()或d3.max()）。

例如，看看这个数组：

["9", "70", "800", "1000"]

最大的数字是多少？你会说1000，对吗？让我们看看：

＆＃13;

console.log(d3.max(["9", "70", "800", "1000"]))

＆＃13;

<script src="https://d3js.org/d3.v4.min.js"></script>

＆＃13;

为什么会这样？因为您要比较字符串。

解决方案：将其强制转换为数字。有几种方法可以做到这一点。例如，使用forEach和一元加号

就地更改数组

＆＃13;

var arr = ["9", "70", "800", "1000"];
arr.forEach(function(_, i, a) {
  a[i] = +a[i]
});

console.log(d3.max(arr))

＆＃13;

<script src="https://d3js.org/d3.v4.min.js"></script>

＆＃13;

另请注意your solution ...

我得到它的工作，我不得不Math.abs（）

... 不正确。你不只是强迫数字，你自己改变号码（如果它是否定的）：

＆＃13;

console.log(Math.abs("-1"))
console.log(Math.abs("1"))

＆＃13;

与：比较：

＆＃13;

console.log(+"-1")
console.log(+"1")

＆＃13;

PS：由于您的修改可以清除问题，因此我建议您删除your other question。

缩放返回值大于域

1 个答案: