Как сохранить SVG, который находится на сайте, на моем компьютере?

16

Мне нужно работать с логотипом с этого сайта (в левом верхнем углу):

введите описание изображения здесь

Вот фрагмент кода, который я скопировал со страницы:

<svg viewBox="0 0 215 50" height="50" width="215" xmlns="http://www.w3.org/2000/svg"><path d="M128.783 40.08v7.74h2.078v-5.66h18.843v5.66h2.08v-7.74h-3.322V5.82h-14.017c0 14.588-.467 23.26-2.596 34.263h-3.064zm-43.58 2.08h4.154V5.82h-4.153v3.116l-9.138 24.352V5.818h-4.153V42.16h4.153v-3.114l9.138-24.35v27.465zm-22.842 0h4.36l-6.904-21.08 4.83-15.262h-2.13l-4.88 15.263H52.08V5.82h-4.155V42.16h4.156v-19h4.048l6.233 19zm71.562-2.08c1.764-10.433 2.492-18.842 2.598-32.186h7.783V40.08h-10.38zm74.6 2.08h4.31L204.894 5.82h-4.31l.88 4.206-6.852 32.137h2.13l2.59-12.097h6.548l2.643 12.098zm-169.574 0h4.31L35....8zm147.355 0h4.158V5.82h-13.968v2.076c-.05 8.05-.414 18.12-1.143 23.204-.466 3.066-1.61 5.508-3.532 5.508v5.555c3.588 0 4.623-4.83 5.246-9.24.936-6.752 1.4-16.976 1.506-25.025h7.732V42.16zM159.88 7.896h9.347V5.818H155.73V42.16h13.497v-2.08h-9.348V20.564h7.265v-2.076h-7.266V7.895zm-59.1 0h9.34V5.818H96.626V42.16h13.496v-2.08h-9.34V20.564h7.266v-2.076h-7.265V7.895zm-96.2 0h8.306v34.267h4.152V7.895h8.306V5.818H4.58v2.077zm28.396 6.023l2.858 14.067h-5.66l2.802-14.067zm169.58 0l2.853 14.067h-5.66l2.807-14.067z"></svg>

Я не очень опытен в этом, но уже пробовал вставить его в текстовый файл с дальнейшим сохранением в формате ".svg", но все тщетно.
(Может быть что-то не так с тегами)

PS: все в порядке с авторским правом! Я просто не могу связаться с другим дизайнером с этого сайта, чтобы попросить вектор прямо сейчас.

website-design svg save

— Аксана Зинчанка
источник

2

Вы получили разрешение на использование / адаптацию логотипа? Вы можете столкнуться с серьезными неприятностями, если просто обойдете веб-сайты с «кражей» логотипов. И если они попросили вас изменить его, почему бы просто не спросить их исходные файлы?

— PieBie

Я сейчас работаю с этим медиа, я просто не могу связаться с одним из их дизайнеров, чтобы попросить вектор!

— Аксана Зинчанка,

Похоже, вы делаете все правильно, вы должны просто сохранить код как .svg, а затем открыть его в векторном редакторе, который поддерживает svg. Как это не работает? Какие графические программы вы пробовали? И какой текстовый редактор (Mac textedit любит все портить неожиданными способами)

— user56reinstatemonica8

1

Как говорит пользователь, просто вставьте его в текстовый редактор и добавьте .svgв конец имени при сохранении. В зависимости от настроек вашей ОС, он все равно может добавить неправильное расширение, например logo.svg.txt. Если это так, просто переименуйте его напрямую (без сохранения) и удалите неправильное расширение (.txt). По сути, он должен открываться правильно, если полное имя файла заканчивается на .svg.

— Дом

20

Вы можете запустить этот код на консоли javascript:

var e = document.createElement('script');
e.setAttribute('src', 'https://nytimes.github.io/svg-crowbar/svg-crowbar.js'); 
e.setAttribute('class', 'svg-crowbar');
document.body.appendChild(e);

или используйте этот букмарклет. Отлично сработало для меня:

— Анибал
источник

1

Да, это работает, но, возможно, добавьте комментарий, объясняющий, что этот запуск является сторонним скриптом на их странице? nytimesРаз сценарий, вероятно , хорошо, но это опасно Habbit учить.

— Том

Это сработало для меня лучше в Safari, чем в Chrome

— MicroMachine

3

Отправленный вами фрагмент кода не является допустимым XML. Требуется декларация XML, а <path>тег должен быть закрыт.

<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 215 50" height="50" width="215" xmlns="http://www.w3.org/2000/svg">
    <path
    d="M128.783 40.08v7.74h2.078v-5.66h18.843v5.66h2.08v-7.74h-3.322V5.82h-14.017c0 14.588-.467 23.26-2.596 34.263h-3.064zm-43.58 2.08h4.154V5.82h-4.153v3.116l-9.138 24.352V5.818h-4.153V42.16h4.153v-3.114l9.138-24.35v27.465zm-22.842 0h4.36l-6.904-21.08 4.83-15.262h-2.13l-4.88 15.263H52.08V5.82h-4.155V42.16h4.156v-19h4.048l6.233 19zm71.562-2.08c1.764-10.433 2.492-18.842 2.598-32.186h7.783V40.08h-10.38zm74.6 2.08h4.31L204.894 5.82h-4.31l.88 4.206-6.852 32.137h2.13l2.59-12.097h6.548l2.643 12.098zm-169.574 0h4.31L35....8zm147.355 0h4.158V5.82h-13.968v2.076c-.05 8.05-.414 18.12-1.143 23.204-.466 3.066-1.61 5.508-3.532 5.508v5.555c3.588 0 4.623-4.83 5.246-9.24.936-6.752 1.4-16.976 1.506-25.025h7.732V42.16zM159.88 7.896h9.347V5.818H155.73V42.16h13.497v-2.08h-9.348V20.564h7.265v-2.076h-7.266V7.895zm-59.1 0h9.34V5.818H96.626V42.16h13.496v-2.08h-9.34V20.564h7.266v-2.076h-7.265V7.895zm-96.2 0h8.306v34.267h4.152V7.895h8.306V5.818H4.58v2.077zm28.396 6.023l2.858 14.067h-5.66l2.802-14.067zm169.58 0l2.853 14.067h-5.66l2.807-14.067z"
    />
</svg>

Однако даже после исправления этих проблем, если я открою это в Inkscape, он все равно будет выглядеть не совсем как логотип на веб-сайте. Возможно, вам лучше попробовать что-то подобное, чтобы извлечь SVG.

— Scribblemacher
источник

Копирование его с помощью Firefox, либо через Инспектор объектов (который добавляет </path>), либо прямо через Источник страницы (который не делает), дает мне SVG, который можно открыть с помощью Illustrator - и он выглядит точно так же, как логотип на сайте.

— usr2564301

3

Если вы используете Safari в macOS, для этого есть встроенная функциональность. Просто щелкните правой кнопкой мыши изображение SVG, нажмите «Сохранить страницу как ...», а затем выберите «Формат: Источник страницы» в появившемся раскрывающемся меню.

— Казимир
источник

Это не работает, если логотип недоступен с помощью кода (например, встроенного в класс) - когда он не просто щелкает правой кнопкой мыши, он может позволить пользователю загрузить изображение или перетащить его на рабочий стол или посмотреть в разработчику. ресурсы страницы меню

— MicroMachine

-3

Скопируйте URL-адрес и откройте его в Inkscape. Очень просто!

— Александра
источник

Привет Александра, добро пожаловать в GDSE и спасибо за ваш ответ. Не могли бы вы дать нам немного больше информации? Как открыть ссылку в Inkscape? Какие пункты меню выбрать? Предположим, что Asker - новичок в программном обеспечении, и вы в основном хороши. Благодарность! Если у вас есть какие-либо вопросы, обратитесь в справочный центр или обратитесь к одному из нас в чате графического дизайна, как только ваша репутация станет достаточной (20). Продолжайте вносить свой вклад и наслаждайтесь сайтом!

— Винсент

-4

Конечно. Сделайте это сложным, если хотите - но это не так. Откройте файл .svg в новом окне браузера. Выберите «Печать» -> «Сохранить как PDF» -> «Открыть в Illustrator» или других векторных приложениях. :)

— Бентен
источник

5

Тогда у вас уже есть SVG - зачем усложнять его, добавляя шаг в PDF?

— Михаэль Шумахер