- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
这是查找 svg 图像中心点并显示点的代码,但出现 el 为 null 的错误。任何人都可以告诉我错误是什么。我可以在此处添加 js 库吗?
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var svg = document.querySelector("svg");
var svgns = "http://www.w3.org/2000/svg";
// get the center
var el = document.querySelector("path");
var bbox = el.getBBox();
var center = {
x: bbox.left + bbox.width/2,
y: bbox.top + bbox.height/2
};
// create the dot
var dot = document.createElementNS(svgns, circle);
console.log(dot);
dot.setAttribute("cx", center.x);
dot.setAttribute("cy", center.y);
dot.setAttribute("r", 10);
svg.appendChild(dot);
</script>
</head>
<body>
<svg height="210" width="400" >
<path d="M75 0 L56 105 L225 200 Z" />
</svg>
</body>
</html>
最佳答案
尝试使用 element.getBoundingClientRect();
而不是 element.getBBox()
,它似乎工作正常:
var svg = document.querySelector("svg");
var svgns = "http://www.w3.org/2000/svg";
// get the center
var el = document.querySelector("path");
var bbox = el.getBoundingClientRect();
var center = {
x: bbox.left + bbox.width/2,
y: bbox.top + bbox.height/2
};
// create the dot
var dot = document.createElementNS(svgns, "circle");
console.log(dot);
dot.setAttribute("cx", center.x);
dot.setAttribute("cy", center.y);
dot.setAttribute("r", 10);
svg.appendChild(dot);
fiddle :http://jsfiddle.net/dd5kY/
关于javascript - svg 中心点出现问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24968825/
如何让div的中心点作为旋转的中心点。 我遇到了 this虽然我正在做一些研究,但我似乎无法将其融入我的研究。 这就是帖子所建议的。但不起作用。$(area).css('-webkit-transfo
您好,我正在做一个应用程序,在我的应用程序中有一个 map 页面,所以我实现了 Google Maps V2,我遇到了一个问题,当我滚动 map 时,我想获得 map 的中心点,如果我滚动 map ,
我正在玩一个简单的 2d 游戏,我正在尝试从级别 1(场景一)切换到级别 2(场景二)。为了测试,两个级别包含相同的内容。这是我的转换代码: let transition = SKTransi
我有一个覆盖大部分屏幕区域的 map 的 View 。 在 map 的顶部,我有一些图像、按钮、文本框。它们位于 map 的顶部,我在这里称其为“无用 map ”,而底部则用于实际查看 map 。这是
给定一个纯白色背景上的对象,有人知道 OpenCV 是否提供了从捕获的帧中轻松检测对象的功能吗? 我正在尝试定位对象(矩形)的角点/中心点。我目前这样做的方式是通过蛮力(扫描对象的图像)并且不准确。我
我试图确保我的 map 中心点位于 kml 层的边界内,我无法找到很多相关信息,但我修改了来自 here 的一些代码。这似乎可行,但当然行不通。 从 Google Maps API 中,我无法判断 .
我试图在用户滚动 UIScrollView 时创建一个非常简单的视差效果。我在我的 ScrollView 上使用 scrollViewDidScroll 方法,一切正常。我可以记录该方法的所有内容,因
我正在使用 svg.js 和出色的 svg-pan-zoom 插件 ( https://github.com/ariutta/svg-pan-zoom )。 现在我想要一个按钮,当我单击它时,它会在我
我是一名优秀的程序员,十分优秀!