Javascript-форум - как нарисовать графические полосы?

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - как нарисовать графические полосы? (https://javascript.ru/forum/misc/24308-kak-narisovat-graficheskie-polosy.html)

Цитата:

Сообщение от dmitriymar

кста ,хотел тебя давно спросить как ты SVG и VML совмещаешь?

Меня? Я типа спец? :D
Никак не совмещаю, с VML напрямую никогда не работал (когда-то пытался, но забил). А SVG встраивается корректно в поддерживаемые браузеры (HTML или XHTML, пофиг) только с помощью XML DOM (createElementNS и пр.). Пример из моего говнокода: https://github.com/finom/jQuery-Gaus...an-blur.js#L61

Цитата:

Сообщение от FINoM

Меня? Я типа спец?

не так много народа юзают SVG.

Цитата:

Сообщение от FINoM

только с помощью XML DOM (createElementNS и пр.).

не,налетел в опере(в последней версии на тот момент) летом прошлым,не динамический svg работал только с XHTML документами-хотя во всех остальных популярных всё было норм. Насколько понял причина в том,что поддержку SVG ввели в НTML5. а Опера тогда(сейчас?) ещё не реализовала поддержку.
так что мысль совмещать VML И SVG изза этого отпала..

Хочешь встраивать SVG прямо на страницу? Типа

<div><svg>...</svg></div>

да вот в принципе один из вариантов мучения с оперой тогда-другие найти не могу...Работает везде кроме оперы,подобное было и с HTML в ней-точный код не работы в HTML найти не могу..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<style type="text/css">
#apDiv1 {
	position:absolute;
	left:221px;
	top:35px;
	width:448px;
	height:331px;
	z-index:1;
}
</style>
</head>

<body>

<div >
  <svg version = "1.1"
     baseProfile="full"
                                  xmlns = "http://www.w3.org/2000/svg" 
                                  xmlns:xlink = "http://www.w3.org/1999/xlink"
                                  xmlns:ev = "http://www.w3.org/2001/xml-events"
     height = "400px"  width = "400px" onclick="qw()">
     <rect x="0" y="0" width="400" height="400" 
          fill="silver" stroke="blue" stroke-width="5px" stroke-opacity="0.5"/>
     <g fill-opacity="0.7" stroke="red" stroke-width="10px" >
        <circle cx="200px" cy="200px" r="100px" fill="red"   transform="translate(  0,0)"  />
        <circle cx="200px" cy="200px" r="100px" fill="blue"  transform="translate( 0, -200)" />
        <circle cx="200px" cy="200px" r="100px" fill="green" transform="translate(0, 200)" />
     </g>
</svg>
</div>

</body>
</html>

потом нашел что изменить для кросбраузерности,но факт остался фактом -кросбраузерная работа с SVG -только в XHTML файлах. VML -работает только в HTML

Как вариант, можно написать парсер, который обрабатывает SVG и вставляет новый, с правильными пространствами имен.

Цитата:

Сообщение от FINoM

Хочешь встраивать SVG прямо на страницу? Типа
<div><svg>...</svg></div>

FINoM,
это тоже нифига не кроссбраузерно. Самое кроссбраузерное это из скрипта. Ну не считая embed и всё такое.

Цитата:

Сообщение от Nekromancer

это тоже нифига не кроссбраузерно. Самое кроссбраузерное это из скрипта.

Я вот и предлагаю брать скриптом то, что в документе, обрабатывать и возвращать обратно.

Ceйчас поставил Оперу 11.60 -в ней код работает. перед обновлением и выкладыванием кода на сайт проверял в более старой версии ,но не намного.

Цитата:

Сообщение от FINoM

если ты об <svg:ns>-не помогало или чегото в этом роде-уже не помню что писал и где писал))).
Дело по ходу не в пространстве имён ,а в заголовке документа

вот ещё одно http://javascript.ru/forum/events/24...tml#post145034
строки 94-95. тоже в каком то браузере был глюк-пришлось вводить это

Цитата:

Сообщение от dmitriymar

если ты об <svg:ns>-не помогало.

Я имею в виду так:

var svg = querySelector('svg');
var newSvg = document.createElementNS(svgns, 'svg');
...
// здесь берем все атрибуты svg, копируем в newSvg с пространствами имен, если есть таковые
// потом рекурсивно проходим по всем детям svg и так же создаем новые элементы, вставляя их в родительский
var tagName = childElement.tagName;
var newChildElement = document.creatElementNS(svgns, tagname);
...
//берем атрибуты из childElement, копируем в newChildElement, вставляем новый элемент в родительский...

Я не помню функций наизусть, поэтому только идея.

я понял твою мысль,да это сработает при правильных заголовках документа. Момент с оперой был -что если заголовки не те -то не работает вообще никак.
ты ведь из HTML документа не сделаешь XHTML документ .
не заменишь <!DOCTYPE html на
<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" >
Только об Опере говорим(пред версии) -в других нет потребности городить такое