Запросить часть SVG в < img > (или < объект >)
Может кто-нибудь объяснить, почему механизм regex java переходит в катастрофический режим этого регулярного выражения?
Для строки:
'pão de açúcar itaucard mastercard platinum SUSTENTABILIDADE])Кажется, что это часть регулярного выражения была бы проблемой:
'(?:[^']+|'')+'Соответствие первой
', а затем неспособность совместить закрытие'и, таким образом, отмена всех комбинаций вложенных кванторов.Если вы разрешаете регулярному выражению возвращаться, он будет отступать (при сбое). Используйте атомарные группы и / или притяжательные квантификаторы, чтобы предотвратить это.
Btw, вам не нужна большая часть экранов в этом регулярном выражении. Единственное, что вам (возможно) нужно избегать в классах символов (
[]) - это символы^-]. Но обычно вы можете позиционировать их так, чтобы им тоже не нужно было бежать. Конечно,\и все, что вы хотите, quoation, строка должна быть (двойной) экранирована."^(?:[^]['\"\\s~:/@#|^&(){}\\\\][^][\"\s~:/@#|^&(){}\\\\]*|\"(?:[^\"]++|\"\")++\"|'(?:[^']++|'')++')"
2 ответа
То, чего вы хотите добиться, проще всего сделать с помощью другого встроенного SVG вместо тега <img> или <object>:
<svg style="width:200px;height:200px" viewBox="35 50 150 150">
<use xlink:href="myFile.svg#head" />
</svg>
Две вещи, которые вам нужно получить, это
- и
viewBox: чтобы получить только ту часть SVG, которую вы хотите, вы должны определить, где находится путь и какой у него ограничивающий прямоугольник. Элемент<use>заботится о том, чтобы был виден только выбранный вами элемент, но он не идентифицирует , где внутри этого изображения находится элемент. - общий размер выбранного элемента. SVG не имеет понятия «естественный размер, вы всегда должны указывать ширину и высоту. ViewBox будет затем помещен внутри этой области.
Пожалуйста, взгляните на этот SVG-файл в view-source. Внутри корневого svg есть 2 других элемента svg. Эти 2 элемента svg имеют каждый идентификатор, и стиль говорит, что элементы nestedsvg видны только в том случае, если :target.
svg > svg:not(:target) {
display: none;
}
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100px" height="100px" viewBox="0 0 225 225">
<style type="text/css">
<![CDATA[
svg > svg:not(:target) {
display: none;
}
]]>
</style>
<desc>
<g id="cat">
<path id="body" fill-rule="evenodd" clip-rule="evenodd" d="M121.506,..."/>
<path id="head" fill-rule="evenodd" clip-rule="evenodd" d="M129.747,..."/>
</g>
</desc>
<svg version="1.1" id="blackcat" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 225 225">
<use xlink:href ="#cat" fill="black" />
</svg>
<svg version="1.1" id="redcat" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 225 225">
<use xlink:href ="#cat" fill="red" />
</svg>
</svg>
Вот как использовать один из этих элементов SVG в качестве изображения или объекта:
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/222579/cat.svg#redcat" width="200" />
<object width="200" data="https://s3-us-west-2.amazonaws.com/s.cdpn.io/222579/cat.svg#blackcat"></object>