Добрый вечер,
столкнулась с такой проблемой:

У меня на html  странице есть svg картинка, и мне нужно  Скрыть объекты  по чекбоксу . Дело в том, что моя свг картинка не содержит ни атрибута class ни id. Подскажите как это реализовать?

Вот картинка на странице:


А вот объект свг , который нужно скрыть на картинке


Как этого добиться? Может кто что- то подскажет?

Спасибо

Добрый,  http://jsfiddle.net/8B4f9/ 





svg элементы такие же элементы DOM.

Спасибо.


Это сообщение отредактировал(а) Karta - 26.7.2013, 15:45

У меня вот только вопрос. Когда я прописываю часть картинки свг на html  странице как  у Вас, у меня все работает, а когда это нужно применить для всей свг картинки, то нет.


Вот я прописываю на странице


Что не так делаю?

Вы лучше на jsffidle сделайте демку, потом скажите, какие элементы не скрываются.

Вот, попробовала, у меня, что то ни один элемент не скрывается. Я вставлялла свг прямо на страницу.

http://jsfiddle.net/V7fQG/

http://jsfiddle.net/V7fQG/1/

У укажите те теги которые хотите скрывать через 

#imap g, #imap line, #imap image

Спасибо, но дело вот в чем:
когда я прописываю код свг непосредственно на самой странице


У меня все отлично работает, но когда я пишу на html  странице только путь к свг картинке у меня ничего не работает, никакого события не происходит



В чем ошибка?

Это сообщение отредактировал(а) Karta - 27.7.2013, 04:16

Скорее всего политика безопасности браузера. f12 в консоле браузера должно об этом говорится.

Да, я просмотрела консол, выдает ошибку в  мне не известном скрипте overlay.js

Use of Mutation Events is deprecated. Use MutationObserver instead. @ chrome://y2layers/content/overlay.js:242

 в строке 


Это можно как нибудь исправить?

Это сообщение отредактировал(а) Karta - 29.7.2013, 01:38

Лечится только если загрудить Svg через аякс и вставить в пустой 

А у Вас это работает? 
Просто результат у меня тот же, хоть с аяксом, хоть без него...

Я в своё время заменил object на iframe. Обращаться к объектам и функциям в этом фрейме можно через свойство contentWindow.
Например document.getElementById('svg_frame').contentWindow.document.getElementById('svg_shape'); в главном документе вернет объект в svg с id=svg_shape
И наоборот из svg достучаться до главного, можно с помощью document.defaultView.top.document

Karta, я не проверял, только теоретически предположил должно сработать если на томже хосте что и сам сайт расположен.
С фреймом должно сработать если фрейм относится к этому же сайту. 

Посмотрела поискала и все таки нашла ответ:

1. Нужно добавить код:



2. А потом просто изметить в коде object#imap g на svg g. Будет примерно так:





Это сообщение отредактировал(а) Karta - 10.8.2013, 17:56

У меня еще один вопрос появылся в процессе работы.
Вот у меня есть код, который при нажатии на чекбокс может скрывать /показывать текст



А как в таком слуае будет выглядить код, если мне нужно сделать текст в виде подсказки tooltip? Т.е текст на свг картинке изначально не виден, нажимаешь на чекбокс "включить подсказки" и при наведении мышки показывает текст, в теге ?

Спасибо

Задать на элемент svg text  событие hover и сделать этот эффект, но лучше взять готовый плагин tipsy

У элемента text должен быть атрибут title который содержит подсказку.
После вставки карты в див  $.get внутри функции выполнить инициализацию




Я не проверял код, но может сработать проверите, должно сработать

Это сообщение отредактировал(а) Sanchezzz - 10.8.2013, 22:55