Usé un mapa de Google, pero necesitamos un nivel de zoom diferente en los dispositivos de ancho de difracción para eso, usé el siguiente código, pero no sé por qué mi código no se está ejecutando.

        $window_width = "<script type='text/javascript'>document.write(window.innerWidth);</script>";
            $window_width = strval($window_width); 
              if($window_width == 1920){
                ?>
                <div class="map c27-map mylisting-map-loading" id="<?php echo esc_attr('map__' . 
            uniqid()) ?>" data-options="<?php echo c27()->encode_attr([
                    'skin' => $data['map']['skin'],
                    'scrollwheel' => $data['map']['scrollwheel'],
                    'zoom' => 10,
                    'minZoom' =>5,
                    'maxZoom' => 5,
                    'draggable' => false,]) ?>">
                </div><?php
              }else{
                ?>
                <div class="map c27-map mylisting-map-loading" id="<?php echo esc_attr('map__' . 
      uniqid()) ?>" data-options="<?php echo c27()->encode_attr([
                    'skin' => $data['map']['skin'],
                    'scrollwheel' => $data['map']['scrollwheel'],
                    'zoom' => 10,
                    'minZoom' => 10,
                    'maxZoom' => 10,
                    'draggable' => false,]) ?>">
                </div>

                <?php
              }
-1
parth mangukiya 11 feb. 2021 a las 14:46

1 respuesta

La mejor respuesta

Puede lograr lo mismo con javascript solo, pero como está mezclando php en opciones de datos, para el escenario actual, lo siguiente podría ser una manera fácil de lograr. (Tenga en cuenta que todavía no he probado la sintaxis, pero debería funcionar).

$output_script = "
  var innerWidth = window.innerWidth;
  var html = '';
  if (innerWidth == 1920) {
    html = `
    <div class="map c27-map mylisting-map-loading" id="<?php echo esc_attr('map__' . 
      uniqid()) ?>" data-options="<?php echo c27()->encode_attr([
              'skin' => $data['map']['skin'],
              'scrollwheel' => $data['map']['scrollwheel'],
              'zoom' => 10,
              'minZoom' =>5,
              'maxZoom' => 5,
              'draggable' => false,]) ?>">
          </div>`
  } else {
    html = `
    <div class="map c27-map mylisting-map-loading" id="<?php echo esc_attr('map__' . 
      uniqid()) ?>" data-options="<?php echo c27()->encode_attr([
              'skin' => $data['map']['skin'],
              'scrollwheel' => $data['map']['scrollwheel'],
              'zoom' => 10,
              'minZoom' =>5,
              'maxZoom' => 5,
              'draggable' => false,]) ?>">
          </div>`

  }
  document.onload(() => document.getElementById('target').innerHTML = html)
";
0
DivineCoder 11 feb. 2021 a las 12:11