Как редактировать стили в Openlayers?

[Spravka-Azov]

Здравствуйте.

Я только начал разбираться в "картостроении", не могли бы вы мне помочь в следующем. Я в данный момент применяю для своего сайта-справочника простейший способ сделать карту точек интереса http://wiki.openstreetmap.org/wiki/Open ... er_example. Однако никак не могу понять, каким образом редактировать стили отображения этих карт, в частности того блока, который появляется при нажатии на точку интереса и выдает инфу о ней, вот как оформить эту инфу и этот блок вообще, вот в этом мой вопрос. Хотелось бы задать свой размер блока, цвет фона, размеры шрифтов и расположение написей, возможность убирать блок по простому нажатию вне его, а не только снова на иконку, ну и т.д., в общем получить ключ ко всем стилям. Спасибо.

А также, не могли бы посоветовать способы составления карт POI по-продвинутей, но с учетом, что яваскрипта я не знаю? Спасибо.

[Konstantin Tokar]

Странные желания. То что Вы хотите требует знания JavaScript и ещё много чего дополнительно.

[Spravka-Azov]

Странные желания. То что Вы хотите требует знания JavaScript и ещё много чего дополнительно.

Что и даже чтоб стили в простом способе подредактировать?!

[Denis Rykov]

Нужно определиться какие именно попапы вы используете, я как-то писал про них. Например, в случае FramedCloud, стиль содержимого описывается внутри CSS-класса .olFramedCloudPopupContent.

[Spravka-Azov]

Нужно определиться какие именно попапы вы используете, я как-то писал про них. Например, в случае FramedCloud, стиль содержимого описывается внутри CSS-класса .olFramedCloudPopupContent.

А как же их определить? Я так понимаю, что в моем случае используется тот, который по умолчанию, а какой не знаю.

[ericsson]

Насчет знания JS - загнули...
Нужно знать CSS, не более того.
Берем любой browser с встроенным инспектором кода (Chrome или Opera) либо Firefox с установленным Firebug.
Открываем окно с картой. Открываем popup. Щелкаем правой кнопкой на содержимом popup. Выбираем в контекстном меню что-нибудь в духе Inspect Element.
Видим в результате подсвеченный код того элемента, на котором щелкнули. Смотрим внимательно на родительские для него элементы (водим мышью по дереву в коде и наблюдаем за подсветкой элементов на самой странице) и находим элемент-контейнер с каким-то характерным классом. Что-нибудь вроде:

Код: Выделить всё

<div id="chicken_contentDiv" class="olPopupContent">

Ну а дальше от этого класса пишем в отдельном css-файлике свои стили, добавив ссылку на этот css-файл в head страницы. Возможно (если где-то стили уже определены) придется к свойствам добавить !important, дабы "перебить" их.
Скажем, шрифт по умолчанию 12пикселей для внутренностей popup будет задаваться кодом

Код: Выделить всё

.olPopupContent {font-size: 12px; }

А заголовок popup'а (для которого, возможно, используется тэг h1) можно стилизовать как-то так (18 пикселей, не жирный, красного цвета):

Код: Выделить всё

.olPopupContent h1 {font-size: 18px; font-weight:normal; color:#C00;}