小编s_d*_*dev的帖子

d3.js 缩放鼠标坐标

我使用 d3.js 缩放功能来放大 svg 内的图像。我使用遮罩来显示下面的底层图像。如果我不缩放蒙版和鼠标光标坐标完美匹配。但是,当我开始缩放时,鼠标坐标不会转换为缩放级别,因此地图显示不再与光标对齐。

这是我到目前为止使用的...我假设缩放时需要某种坐标转换?

  var lightMap = d3.select("#lightMap").call(d3.behavior.zoom().scaleExtent([1, 3]).on("zoom", zoom));
var darkMap = d3.select("#darkMap").call(d3.behavior.zoom().scaleExtent([1, 3]).on("zoom", zoom));


function zoom() {
lightMap.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
darkMap.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");


}
var svg = d3.select("svg");


svg.on('mousemove', function () {

 var coordinates = [0, 0];
coordinates = d3.mouse(this);
var x = coordinates[0];
var y = coordinates[1];



    primaryCircle.setAttribute("cy", y + 'px');
    primaryCircle.setAttribute("cx", x + 'px');        
Run Code Online (Sandbox Code Playgroud)

});

javascript svg d3.js

5
推荐指数
1
解决办法
2898
查看次数

铅笔般的功能

我一直在寻找一种方法来使用D3和手绘铅笔的功能.这是可行的吗?我查看了mbostock网站上的不同示例,但找不到允许您在可缩放区域内手动绘制的任何内容.

d3.js

3
推荐指数
1
解决办法
987
查看次数

通过将 URL 图像转换为二进制来解决 CORS 问题

我从 API 中提取了一些数据,其中一个属性是图像 url。所以我把那个 url 放在 . 但是,我需要从 url 中获取该图像,将其转换为二进制,以便我可以将其发送到要存储的数据库,以二进制形式而不仅仅是一个 url。

我尝试了两种方法,一种使用 FileReader 转换为 blob,另一种使用写入 a 并转换为 blob。但是,使用这两种方法,来自 URL 的图像的主机给了我 CORS 拒绝,因为请求不是来自同一个域,我理解。我无法控制在另一台服务器上设置标头,但我确实需要将 url 图像转换为二进制。反正有没有在我自己的服务器上进行转换的情况下做到这一点?

javascript blob image cors

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

标签 统计

d3.js ×2

javascript ×2

blob ×1

cors ×1

image ×1

svg ×1