小编use*_*701的帖子

将SVG路径数据转换为0-1范围,以用作objectBoundingBox的clippath

我使用从Illustrator导出的相当复杂的SVG形状作为剪切路径.

问题是objectBoundingBox要求路径数据在0-1范围内,并且我的路径包含超出此范围的路径数据.这是我正在使用的:

<svg>
  <clippath id="clipping" clipPathUnits="objectBoundingBox">
    <path d="M228.6,94.8L176.8, 5.5c-2-3.5-5.8-5.5-9.9-5.5H63.2c-4.1, 0-7.8, 1.9-9.9,5.5L1.5,94.9c-2, 3.5-2,7.8,0, 11.4       l51.8, 89.8c2,3.5, 5.8,5.9,9.9,5.9h103.7c4.1, 0, 7.8-2.4,9.9-6l51.8-89.7C230.7, 102.8,230.7, 98.3,228.6,94.8z M192.8,104.4l-35.5, 
      61.5c-1.4,2.4-4,4.1-6.8, 4.1h-71c-2.8,0-5.4-1.7-6.8-4.1l-35.5-61.4c-1.4-2.4-1.4-5.5,0-7.9l35.5-61.5c1.4-2.4,4-4.1,6.8-4.1h71c2.8, 0, 5.4,1.7,6.8,4.1l35.5, 61.4C194.2,98.9, 194.2, 102, 192.8, 104.4z"/>
  </clippath>
</svg>
Run Code Online (Sandbox Code Playgroud)

有没有一个简单的解决方案将其转换为0-1范围,以便我可以使用objectBoundingBox?

RE:评论.我能够将任意数量的变换应用于SVG元素,但它仍然不能与objectBoundingBox一起使用.例如:

<clippath id="clipping" transform="scale(1,1)" clipPathUnits="objectBoundingBox">
Run Code Online (Sandbox Code Playgroud)

html css svg

7
推荐指数
2
解决办法
2439
查看次数

for循环中有多个随机结果?

我正在尝试创建64个方块,并为每个方块赋予独特的背景颜色.我非常接近,但我似乎只能得到一种随机颜色.

function randomCol() {
    return Math.floor(Math.random()*16777215).toString(16); 
}

$(function(){
  for(i=0; i<64; i++) {
        $('<div class="square"></div>').insertAfter(".starter");
        $(".square").css({'background':'#' + randomCol()});
  }
 });
Run Code Online (Sandbox Code Playgroud)

javascript jquery

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

标签 统计

css ×1

html ×1

javascript ×1

jquery ×1

svg ×1