gpt4 book ai didi

javascript - 更改页面 D3/JS 上的形状位置

转载 作者:行者123 更新时间:2023-11-28 02:03:57 26 4
gpt4 key购买 nike

<!DOCTYPE html>
<html>
<head>
<title>Practice</title>
<script type="text/javascript" src="http://d3js.org/d3.v2.js"></script>
</head>
<body>

将div链接到js

<div id="svgpathSVGdata"></div>

D3.js 的开始

<script type="text/javascript">


var divElem = d3.select("#svgpathSVGdata");

设置 Canvas

    var svgcanvas = divElem.append("svg:svg")
.attr("width", 800)
.attr("height", 800);

目前它是颠倒的,我也希望将它移动到更中心的地方

    svgcanvas.append("svg:path")
.attr("d","M -200,0 A200,200 0 0,0 500,0 L -200,0")
.style("stroke-width", 2)
.style("stroke", "steelblue")
.style("fill", "none");
</script>

</body>
</html>

最佳答案

您可以应用 transform 属性来移动您的路径并将其翻转到正确的一侧:

var divElem = d3.select("#svgpathSVGdata");
var svgcanvas = divElem.append("svg:svg")
.attr("width", 800)
.attr("height", 800);
svgcanvas.append("svg:path")
.attr("d","M -200,0 A200,200 0 0,0 500,0 L -200,0")
.attr("transform", "translate(220,400) scale(1, -1)")
.style("stroke-width", 2)
.style("stroke", "steelblue")
.style("fill", "none");​

http://jsfiddle.net/QALqg/

关于javascript - 更改页面 D3/JS 上的形状位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12628500/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com