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

подскажите пожалуйста, как при помощи JS можно нарисовать такую штуку как на рисунке:
что бы от одного круга отходили полосы к другим, а те круги в свою очередь находятся на разных растояниях, и желательно что бы на конце полос были такие штуки как на рисунке,
как такое реализуется?не используя фреймворки, такое возможно вообше?
те круги, к которым идут полосы от главного, появляются рендомно

бро вот тут все скажут
http://javascript.ru/forum/job/

а я просил что бы за меня сделали? я просил что бы мне подсказали

canvas

так он вроде в IE7 - 8 не работает и фоксе ниже 4, а на этом белом свете есть еше такие уникалы которые юзают эти браузера
мне не то как круги нарисовать нужно, а сами те полосы, круги у меня есть и рендомно они появляются, я не знаю как полосы нарисовать

Raphael. Только я не знаю, как нарисовать дугу, кроме как кривыми Безье, с которыми не очень дружу. Если есть сильное желание, то разберетесь.

Под первым тоже сидят что ле?
А для ИЕ есть VML

подсказываю SVG

http://sourceforge.net/projects/excanvas/ подключить и будет работать.не всё, но для этого хватит
и кстати, в ФФ 3.6 канва работает

;) почитай в доках с какой версии ие поддерживает SVG

а вообше ризонно так делать? SVG или КОНВАС, если мне всего то полоску провести, у меня есть блок(div)на весь экран, в котором рендомно появляются круги, что конвас что свг будет как имг, грубо говоря большой квадрат сделает с прозрачным фоном и на нем нарисует полоску от главного круга к вторичному,только будет находиться под блоком где где круги мои, это нормально?

точно, я просто верстаю под браузеры, в ие не особо разбираюсь)

это хак на ЕИ8 - 7 что бы канвас поддерживал?

да, это нормально. и лучше круги тоже там реализовать.

нормально
да

что то там файла нет, не могу скачать

а пройти дальше по ссылкам и выйти сюда? не? или в гугле забить название и найти?

а все нашел вроде, на гугл они переехали,
всем спасибо за помощь, огромное спасибо

ха ха как ни странно но не работает хак, там даже в примерах в архиме не работает в ие 8

как ни странно он работает:) подключал сам-просто необходимо прочитать доки как подключать его.
открою даже секрет -позволяет динамически создавать канву:)
а не работает у тех кто не смог пару действий сделать. помимо этой есть и другие библиотеки.

да я примеры в архиве смотрел не робят) в архиве с библиотекой)

в любом случаии спасибо огромное что то буду делать с этим)

вариант 1 найти библиотеку с рабочими примерами
вариант 2-браузер кривой(скрипт у него точно включен?)

да точно

такой вопрос, вот эти мои кружочки люди буту двигать(драг дропом), и к примеру их будет 10, при движении нужно что бы та полоска прорисовывалась(в реальном времени а не когда закончится движение кружка), сильно будет тормазить? или при таком раскладе нужен другой способ реализации полосок?

такой пример http://raphaeljs.com/graffle.html
возможно, поможет выбрать библиотеку

да я его видел, но там SVG, вот именно такое и хочу реализовать, особенно как линии сгибаются клево

czp, то что вы тут пишете, удивительно напоминает один плагин для jQuery. Если он вам это нужно для использования - гуглите в сторону плагинов для jq. Если хотите реализовать "для себя" - вперёд, учить API графических инструментов и их особенности в разных браузерах.

А чем SVG не нравится?
И на всякий случай: для IE8- там используется VML.

FINoM,
кста ,хотел тебя давно спросить как ты SVG и VML совмещаешь?
в случае кросбраузерной работы с SVG документ ХHTML(опера к сож не работает(ла) с SVG в НTML), а VML-HTML?

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

не так много народа юзают SVG.
не,налетел в опере(в последней версии на тот момент) летом прошлым,не динамический 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,
это тоже нифига не кроссбраузерно. Самое кроссбраузерное это из скрипта. Ну не считая embed и всё такое.

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

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

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

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

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" >
Только об Опере говорим(пред версии) -в других нет потребности городить такое