После болезненных экспериментов, чтобы найти что-то быстрее, чем принятый ответ, я получил это, чтобы работать. Он работал примерно в 100 раз быстрее в наборе данных, на котором я его пробовал.
Если кто-то знает способ сделать это более элегантным, обязательно измените мой код. Я не мог найти способ, который работает без установки других столбцов, которые вы хотите сохранить в качестве индекса, а затем сбросить индекс и переименовать столбцы, но я бы предположил, что есть что-то еще, что работает.
b = DataFrame(a.var1.str.split(',').tolist(), index=a.var2).stack()
b = b.reset_index()[[0, 'var2']] # var1 variable is currently labeled 0
b.columns = ['var1', 'var2'] # renaming var1
¡С элементом объекта!
<object data="example.svg" type="image/svg+xml">
<!-- If browser don't soport / don't find SVG -->
<img src="example.png" alt="Logotype" />
</object>
Если я работаю с элементами <img>
(в отличие от фоновых изображений CSS), я использую удобное обходное решение, комбинацию Modernizr (библиотека JavaScript, которая обнаруживает наличие определенных функций , например, поддержка .svg в браузерах) и несколько строк jQuery:
$(".no-svg img").each(function() {
var $this = $(this);
if ($this.attr("src").indexOf(".svg") > -1) {
var isSvg = $this.attr("src").toString();
var isPng = isSvg.replace(".svg", ".png");
$this.attr("src", isPng);
}
});
1) Я создаю .png версии каждого .svg-файла. 2) Modernizr предоставляет элементу html класс .no-svg
, если он обнаруживает, что поддержка .svg отсутствует. 3) jQuery меняет местами расширения файлов. .indexOf(".svg")
проверяет, содержится ли строка ".svg"
в пределах значения src
, возвращая -1
, если она не находит его и положительное целое число, если оно выполняется. Если он найдет ".svg"
, вся цепочка src
втягивается в isSvg
, а .replace()
свопы .svg
для .png
и сохраняет результат как isPng
, который затем устанавливается как значение src
.
Все основные браузеры поддерживали годы, кроме & lt; = IE8. Обходной путь может быть, например, RaphaelJS.
Источники:
Для фоновых изображений, вот простой способ отбросить фон PNG для старых браузеров:
http://signaltower.co/2013/02/25/add-png-fallbacks- имеющиеся в наличии для SVG-файлов /
отредактировано: Я использовал ссылку на очень красивую таблицу сравнения SVG, но он не обновлялся с 2011 года, поэтому он больше не имеет отношения к делу.
... или вы можете разрешить серверу apache:
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} MSIE\s[5-8]\.
RewriteCond %{REQUEST_FILENAME} ^.+?\.svg$
RewriteRule ^(.+?)\.(?:svg)$ $1\.png [L]
вам нужно создавать только .png версии каждого .svg-файла, и не имеет значения, является ли файл для css background или для тега img.
Вы можете использовать SVG в целом для всех изображений. Таким образом, вы будете покрывать все вещи сетчатки на iDevices. Другие устройства последуют рано или поздно.
Для браузеров, которые не поддерживают svg, вы можете дать телу класс «no-svg».
В вашем CSS просто добавьте '.no-svg .yourimageclass' и вместо этого поместите png. (переопределите его)
Boilerplate HTML5 дает вам этот класс no-svg уже по умолчанию с некоторой магией javascript. (например, для IE8)
Стоит отметить, что если вам нужна поддержка & lt; = IE8, вы можете реализовать GoogleChromeFrame достаточно легко, чтобы получить поддержку SVG, которую вы ищете ...
Хотя вы можете обнаружить, что каждый браузер имеет их собственные небольшие причуды в отношении особенностей спецификации. У меня были проблемы с динамически создаваемыми узлами, которые используют фильтры, а animateMotion слишком долго искажен в Google Chrome ... (по этой причине мы используем FF5 + в качестве наших интерактивных интерфейсов, Safari тоже становится лучше)
IMO, если все приложение не является SVG, я бы просто использовал PNG для ваших значков, если вы не хотите, чтобы они красиво масштабировались! :)
... но если вы просто хотите играть с SVG, Giv'er! ;)
Вы можете использовать скрипт caniuse.js , чтобы определить, поддерживает ли ваш браузер SVG или нет:
caniuse.svg()
Спецификация SVG обширна, и ни один браузер в настоящее время не поддерживает всю спецификацию. Говоря о , все последние версии всех основных браузеров имеют базовую поддержку SVG . Поскольку ни одна из них не имеет полной поддержки, вам нужно будет проверить отдельные функции в каждом браузере, на который настроен таргетинг.
Здесь можно найти полную матрицу совместимости браузера .
Обходным решением для старых версий IE является использование VML . Если требуется поддержка IE6 и вы рисуете код, тогда Raphael.js выполнит эту проверку совместимости для вас и сделает рендеринг с помощью VML или SVG, если это необходимо. Но если вы загружаете необработанный файл SVG и используете его как источник изображения, который не будет работать.
Другой вариант для старых браузеров - использовать библиотеку JavaScript canvg . Это чистый JavaScript-синтаксический анализатор SVG, который сделает результирующий образ на холсте, но это может быть излишним.