小编lou*_*her的帖子

如何使用 d3 获取地图以准确显示经度和纬度

我正在使用 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)

javascript coordinates d3.js

2
推荐指数
1
解决办法
2313
查看次数

如何将循环的每个迭代包装在单独的div容器中

我正在尝试创建嵌套在数组中的对象列表.我能够将每个对象的属性附加到特定元素(即"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)

javascript arrays for-loop object

0
推荐指数
1
解决办法
91
查看次数

标签 统计

javascript ×2

arrays ×1

coordinates ×1

d3.js ×1

for-loop ×1

object ×1