我正在使用 d3.js 尝试映射 csv 数据文件的坐标,该文件包含订单 ID、订单发货地址的纬度和经度以及订单花费的金额。我尝试过将它们线性地绘制出来并尝试使用对数刻度,但绘图点似乎仍然倾斜。我试图让它看起来像美国地图,它有点相似,但地图似乎扭曲/倾斜。我确保将经度设置为 x 轴,将纬度设置为 y 轴。圆圈的半径与订单花费的金额有关。我想知道它是否与使用的比例有关,但这是我第一次尝试弄乱 d3,所以任何帮助/建议将不胜感激!
var outerWidth = 500;
var outerHeight = 250;
var margin = { left: -50, top: 0, right: -50, bottom: 0 };
var xColumn = "longitude";
var yColumn = "latitude";
var rColumn = "total";
var dollarPerPixel = 10;
var innerWidth = outerWidth - margin.left - margin.right;
var innerHeight = outerHeight - margin.top - margin.bottom;
var svg = d3.select("body").append("svg")
.attr("width", outerWidth)
.attr("height", outerHeight);
var g = svg.append("g")
.attr("transform", "translate(" + margin.left …Run Code Online (Sandbox Code Playgroud) 我正在尝试创建嵌套在数组中的对象列表.我能够将每个对象的属性附加到特定元素(即"title"属性放在H1元素中,等等); 但是,我希望每个对象及其所有属性都包含在每个对象的单独DIV元素中.截至目前,所有对象都在一个div中.我想也许有一个forEach循环可能是必要的.我已经尝试搞乱它,似乎无法解决这个问题,虽然看起来它应该相当简单.
这是我的代码:
<div id="container"></div>
Run Code Online (Sandbox Code Playgroud)
CSS
#container {
margin:50px;
padding: 50px;
border: 1px solid black;
}
Run Code Online (Sandbox Code Playgroud)
和脚本:
var ads = [
{
title: "Title 1",
description: "Lorum ipsum dolor",
start_date: "2018-09-01",
end_date: "2018-12-30",
offer: "50% Off",
num_of_products: 7
},
{
title: "Title 2",
description: "Lorum ipsom",
start_date: "2018-08-01",
end_date: "2018-11-30",
offer: "Save $25",
num_of_products: 10
},
{
title: "Title 3",
description: "Lorum ipsum dolor etc",
start_date: "2018-09-01",
end_date: "2018-10-30",
offer: "35% Off",
num_of_products: 8
},
];
const parent = document.getElementById("container"); …Run Code Online (Sandbox Code Playgroud)