Запитання з тегом «svg»

На цей питання є відповіді на Stack Overflow на російській мові : Прозрачний текст вирезан з фони Чи є спосіб зробити прозорий текст, вирізаний із фонового ефекту, такого як на наступному зображенні, за допомогою CSS? Було б сумно втратити всі цінні SEO, оскільки зображення замінюють текст. Спочатку я подумав про …

92 css  svg  fonts  css-shapes 

Мені цікаво, чому так мало сучасних веб-сайтів все ще використовують лише PNG для піктограм (але це припущення лише базується на моєму спостереженні). Наразі я знаю, що основними причинами використання PNG над SVG є IE8 і те, що SVG використовує більше потужності центрального процесора (але я не вірю, що це проблема …

92 html  svg  icons 

Чи можу я використовувати свій перетворений image.svg як піктограму карти Google. Я перетворював своє зображення у форматі png у формат svg, і я хочу використовувати цей символ на карті Google, який можна повертати. Я вже намагався використовувати символ google map, але я хочу мати такий значок, як автомобіль, людина тощо …

91 google-maps  google-maps-api-3  svg 

У мене є серія прямокутників svg (з використанням D3.js), і я хочу відобразити повідомлення при наведенні миші, повідомлення повинно бути оточене вікном, який виконує роль фону. Вони обидва повинні бути ідеально вирівняні між собою та прямокутником (зверху та по центру). Який найкращий спосіб це зробити? Я спробував додати текст svg, …

91 javascript  svg  d3.js  tooltip 

Я хочу отримати дані шляху SVG із гліфів Font Awesome, щоб я міг використовувати їх прямо як SVG у своєму HTML. Я думав, що це буде так само просто, як скопіювати дані шляху з fontawesome-webfont.svg , але коли я використовую їх у своєму HTML, всі символи відображаються догори ногами. Хтось …

89 html  svg  font-awesome 

Ось ілюстрація проблеми (перевірена у Firefox та Chrome): <div style="background-color: red;"><svg height="100px" width="100" style="background-color: blue;"></svg></div> Запустіть фрагмент кодуСховати результатиРозгорніть фрагмент Переглянути на JSFiddle Зверніть увагу на зайвий redпростір усередині divсинього svg. Вже спробував налаштування paddingі marginдля обох елементів 0, але без удачі.

88 html  css  svg 

У HTML5 елементи можуть мати довільні метадані, що зберігаються в атрибутах XML, імена яких починаються з data-таких як <p data-myid="123456">. Це також частина специфікації SVG? На практиці ця техніка в багатьох місцях чудово працює для документів SVG. Але я хотів би знати, чи є це частиною офіційних специфікацій SVG чи …

87 svg  web-standards 

У мене є такий SVG: <svg> <g> <path id="k9ffd8001" d="M64.5 45.5 82.5 45.5 82.5 64.5 64.5 64.5 z" stroke="#808600" stroke-width="0" transform="rotate(0 0 0)" stroke-linecap="square" stroke-linejoin="round" fill-opacity="1" stroke-opacity="1" fill="#a0a700"></path> <path id="kb8000001" d="M64.5 45.5 82.5 45.5 82.5 64.5 64.5 64.5 z" stroke="#808600" stroke-width="0" transform="rotate(0 0 0)" stroke-linecap="square" stroke-linejoin="round" fill-opacity="1" stroke-opacity="1" fill="url(#k9ffb0001)"></path> </g> …

87 xml  image  svg  vector-graphics 

Який правильний спосіб отримати розміри svgелемента? http://jsfiddle.net/langdonx/Xkv3X/ Chrome 28: style x client 300x100 offset 300x100 IE 10: stylex client300x100 offsetundefinedxundefined FireFox 23: "style" "x" "client" "0x0" "offset" "undefinedxundefined" Є властивості ширини та висоти svg1, але .width.baseVal.valueце встановлюється лише в тому випадку, якщо я встановив атрибути ширини та висоти для елемента. …

85 javascript  svg 

Скажімо, у мене є пара складених фігур ( <g>). Я хочу мати можливість натискати та перетягувати їх, але хочу, щоб той, який зараз перетягується, був зверху іншого в порядку Z, так що, якщо я перетягну його над ІНШИМ, другий слід затьмарити.

85 javascript  svg 

Я возиться з SVG, і я сподівався, що зможу створити файли SVG в Illustrator і отримати доступ до елементів за допомогою Javascript. Ось файл SVG Illustrator запускається (здається, це також додає навантаження сміття на початок файлу, який я видалив) <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg …

83 javascript  svg  raphael 

Я створюю веб-сайт портфоліо. HTML-код <div id = "hero"> <div id = "social"> <img src = "facebook.svg"> <img src = "linkedin.svg"> <img src = "instagram.svg"> </div> </div> CSS-код (за допомогою SASS) #hero { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 300px; #social { width: 50%; display: flex; justify-content: …

82 html  css  svg  sass 

Який ефективний спосіб перенести елемент SVG у верхню частину z-порядку, використовуючи бібліотеку D3? Мій конкретний сценарій - це кругова діаграма, яка виділяє (додаючи a strokeдо path), коли миша знаходиться над даним фрагментом. Блок коду для створення моєї діаграми знаходиться нижче: svg.selectAll("path") .data(d) .enter().append("path") .attr("d", arc) .attr("class", "arc") .attr("fill", function(d) { …

81 javascript  svg  d3.js 

Я новачок у кодуванні d3 та svg і шукаю спосіб обертати текст по осі x діаграми. Моя проблема полягає в тому, що, як правило, заголовки xAxis довші, ніж стовпчики на гістограмі, широкі. Тому я прагну повернути текст, щоб він працював вертикально (а не горизонтально) під xAxis. Я спробував додати атрибут …

81 text  svg  transform  d3.js 

Як я можу створити SVG-графіку за допомогою JavaScript? Чи всі браузери підтримують SVG?

80 javascript  graphics  svg