UMIhelp

Разработка сайта на UMI.CMS => Шаблоны XSLT => Тема начата: 31rus от 20 Декабря 2016, 12:28:22

Название: Google map API при помощи transform
Отправлено: 31rus от 20 Декабря 2016, 12:28:22
Нужна помощь, пытаюсь создать iframe окно.
Есть файл который вызывается upage//7?transform=modules/content/map.xsl

Содержимое файла следующее
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE xsl:stylesheet SYSTEM "ulang://i18n/constants.dtd:file">
<xsl:stylesheet version="1.0"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:date="http://exslt.org/dates-and-times"
                xmlns:udt="http://umi-cms.ru/2007/UData/templates"
                xmlns:xlink="http://www.w3.org/TR/xlink"
                exclude-result-prefixes="xsl date udt xlink">

    <xsl:output method="html" encoding="utf-8"/>
    <xsl:template match="udata">
        <xsl:text disable-output-escaping="yes">&lt;!DOCTYPE html&gt;
</xsl:text>
        <html>
            <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
                <script src='https://maps.googleapis.com/maps/api/js?v=3.exp&amp;callback=initialize&amp;key=AIzaSyDsCRTkkT4xZOD4sk8CkMdO9qxjqruP7y8'></script>
            </head>
            <body>
                <script src='/templates/boat/js/maps.js'></script>
                <div style='overflow:hidden;height:444px;width:520px;'>
                    <div id='gmap_canvas' style='height:444px;width:520px;'></div>
                </div>
            </body>
        </html>
    </xsl:template>

</xsl:stylesheet>

Код JS

function initialize(element_id, lat, lng)
{
    var zoom = 10;

    var mapLocation = new google.maps.LatLng(lat, lng);
    var mapOptions =
    {
        center: mapLocation,
        zoom: zoom
    };

    var map = new google.maps.Map(document.getElementById(element_id), mapOptions);
}
initialize('gmap_canvas', 52.56, 10.3);

Но в результате, на странице ничего не выводиться. Если просто вставить данный код в шаблон, то все отрабатывает.
Название: Re: Google map API при помощи transform
Отправлено: aghigay от 20 Декабря 2016, 12:32:24
Вы вставляете в IFRAME в виде http://site.ru/upage/7?transform=modules/content/map.xsl или только upage//7?transform=modules/content/map.xsl ? Если второй вариант - то это не сработает
Название: Re: Google map API при помощи transform
Отправлено: 31rus от 20 Декабря 2016, 12:38:15
Вы вставляете в IFRAME в виде http://site.ru/upage/7?transform=modules/content/map.xsl или только upage//7?transform=modules/content/map.xsl ? Если второй вариант - то это не сработает
В iframe но даже если я в браузере вызываю трансформацию шаблона, то тоже не отрабатывает(
http://nautilus-boat.com/upage//7?transform=modules/content/map.xsl
Название: Re: Google map API при помощи transform
Отправлено: aghigay от 20 Декабря 2016, 12:41:11
У вас:
<xsl:template match="udata">
Надо
<xsl:template match="/">
Название: Re: Google map API при помощи transform
Отправлено: 31rus от 20 Декабря 2016, 12:46:33
Не имеет значения, ошибка возникает в обработке JS(
Сейчас взял пример Google, вылезает ошибка initMap is not a function
Название: Re: Google map API при помощи transform
Отправлено: aghigay от 20 Декабря 2016, 12:49:54
Попробуйте:
1. сделать унифицированно (то есть положить оба вызова script в head)
2. сделать в другой последовательности (то есть сначала обозначить свой файл с функциями, а потом уже подгружать JS Google)
Название: Re: Google map API при помощи transform
Отправлено: 31rus от 20 Декабря 2016, 13:14:58
С делал еще проще, вставил пример как есть
<?xml version="1.0" encoding="UTF-8"?>

<xsl:stylesheet   version="1.0"
                   xmlns="http://www.w3.org/1999/xhtml"
                   xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                   xmlns:date="http://exslt.org/dates-and-times"
                   xmlns:udt="http://umi-cms.ru/2007/UData/templates"
                   xmlns:xlink="http://www.w3.org/TR/xlink"
                   exclude-result-prefixes="xsl date udt xlink">

    <xsl:output encoding="utf-8" method="html" indent="yes" />
    <xsl:template match="/">
        <xsl:text disable-output-escaping="yes">&lt;!DOCTYPE html&gt;
</xsl:text>
        <html>
            <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>



            </head>
            <body>

                    <div id='map' style='height:444px;width:520px;'></div>
                <script>

                    var map;
                    function initMap() {
                    map = new google.maps.Map(document.getElementById('map'), {
                    center: {lat: -34.397, lng: 150.644},
                    zoom: 8
                    });
                    }

                </script>
                <script src='https://maps.googleapis.com/maps/api/js?v=3.exp&amp;key=AIzaSyDsCRTkkT4xZOD4sk8CkMdO9qxjqruP7y8&amp;callback=initMap'></script>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>
При вызове через трансформацию шаблона ошибки, если вставить код в HTML статический все работает((((
Название: Re: Google map API при помощи transform
Отправлено: aghigay от 20 Декабря 2016, 13:26:57
Какие ошибки? Все работает
Название: Re: Google map API при помощи transform
Отправлено: 31rus от 20 Декабря 2016, 13:37:37
В сафари выдает ошибку TypeError: null is not an object (evaluating 'f.style.height="100%"')
В хроме работает, это я 3 дня не в ту сторону копал получаеться)))
Название: Re: Google map API при помощи transform
Отправлено: aghigay от 20 Декабря 2016, 13:41:13
:-)
Название: Re: Google map API при помощи transform
Отправлено: 31rus от 21 Декабря 2016, 10:01:21
Вот только не понятно почему так происходит только в сафари и только через трансформацию((((
Да и еще один скрипт не работает в сафари(((