AngularJS调整绝对SVG路径

时间:2016-03-10 12:51:07

标签: javascript jquery css angularjs svg

我正在尝试在连接容器后实现带有SVG路径的Bootstrap网格。问题是我在角度控制器绝对中创建路径然后没有可调整大小/响应。你们有什么技巧可以解决我的问题吗?

用于创建路径的CodeSnippet :(可行)

var tmpPath = document.createElementNS('http://www.w3.org/2000/svg',"path");
tmpPath.setAttribute("d", "M"+ aHor + "," + aVert +" L" + bHor + "," + bVert);
this.setPathStyle(tmpPath, id);
root.appendChild(tmpPath);

路径样式:

stroke-dasharray: 1000;
stroke-dashoffset: 1000;
position : absolute;
stroke : black;

HTML网格:

<svg class="svg"></svg>
<div id="start" ng-controller="PathController as pc">
  <div class="col-md-6">
    <div id="box1" class="box" ng-init="pc.init(1)">
      <h1>some text</h1>
    </div>
  </div>
  <div class="col-md-2">
    <div id="box2" class="box" ng-init="pc.init(2)">
      <img class="img" src="path">
    </div>
  </div>
  <div class="col-md-4">
    <div class="box">
      <img class="img" src="path2">
    </div>
</div>

svg风格:

position: absolute;
top:0;
left: 0;
height: 100%;
width: 100%;

我已经尝试从jquery和'resize'调用一个新的控制器函数,如“changePath”,但是得到了jqLit​​e无法实现的错误... 我也尝试了一些没有成功的“viewBox”的解决方案......

0 个答案:

没有答案