Предзагрузка содержимого div

[Dozentos]

Есть карта в формате svg. При её загрузке на страницу регионы появляются по очереди, а хотелось бы чтоб появлялась сразу вся карта.
Можно ли поставить некую картинку на заставку в блок div , а уже после полной загрузки карты заменить эту картинку картой?

Вариант:
$(document).ready(
function(){
$('#conteyner-map').load('includes/map_svg.html')
});
по понятным причинам не подходит. Нужно чтоб карта была полностью загружена на момент вывода.

[danik.js]

При её загрузке на страницу регионы появляются по очереди

Где демо проблемы? Вся карта представляет из себя один svg-файл?
Если он настолько сложный что браузер его долго рендерит, то не думаю что возможно отследить этот процесс.

[Dozentos]

Карта представляет из себя xml-код svg за вычетом самого объявления xml (<?xml version="1.0" encoding="utf-8"?>). Она сделана отдельным html-файлом для вставки в основной html страницы (так вроде оптимальней для кодинга).
Достаточно объемный код (не сверх, но всё же). Браузер его рендерит:
при быстром соединении 3-5 сек
при медленном по полминуты и более...

При любом соединении регионы появляются по очереди, а этого и хочеться избежать.
Неужели это не возможно???

[Dozentos]

Может можно как-то через тот же $('#conteyner-map').load('includes/map_svg.html'), но не выводить ответ сервера до полной загрузки собственно ответа?

[danik.js]

Все же не ясно зачем svg совать в html. Ведь в таком случае поддержка браузеров хуже. Изначально браузеры поддерживали только <object> и <img> с svg. Инлайновый svg прямо в html уже придумали позже. http://caniuse.com/#search=svg.

Вариант:
$(document).ready(
function(){
$('#conteyner-map').load('includes/map_svg.html')
});
по понятным причинам не подходит. Нужно чтоб карта была полностью загружена на момент вывода.

load запрашивает ресурс через XMLHttpRequest и вставляет полученный код только получив его целиком. Не это ли требуется?

[Dozentos]

Вот что получается при использовании load http://proba-global.mcdir.ru/
При быстром соединении, может и не заметно, а при медленном отчетливо видно как регионы карты выводятся поочерёдно, да ещё и ниже conteyner-map...

[Deff]

Dozentos,
Вариант 1.Поставьте иконку прелоадера до полной загрузки,
Вариант 2- подгружать карту в скрытый div, с последующей перезаписью в LocalStorage после полной загрузки Главной страницы(если её уже там нет), на странице с картой оттуда вытаскивать

[Dozentos]

А по поводу поддержки браузеров:
Может она и лучше, но запустить это дело под IE 8 у меня получилось только используя конструкцию вида: <div class="mapArea" data-path="m 173.21875,211.4687......></div> и плагина raphael.
В остальном браузеры поддерживают обе конструкции (как через <object>, так и мой вариант), но с для моего варианта проще писать код. (по крайней мере, мне так кажеться).

[Dozentos]

Deff,
а можно оба ваших варианта с примером кода?
Потому как я вроде бы сделал по варианту № 1, но результат не оправдал ожиданий по причине уже выше описанной (даже ссылка на пример работы есть, правда не факт, что быстром соединении заметен недостаток).

А сделано так:
В <div id='conteyner-map'> вставлен <img>, а в javascript прописано:
$(document).ready(function () {
$('#conteyner-map').load('includes/map_svg.html');
});

Может надо как-то иначе????

[Deff]

Dozentos,
Может тупо подобрать задержку ? ( Я не знаю признака окончания загрузки для svg...

$(window).load(function () {
 setTimeout(function () {alert('Done')},9000);
});

Можно поэкспериментировать вставляя в конец подгружаемого контента пиксельное изо и отслеживать его загрузку