Ir para o conteúdo

Smarty

Rotinas para geração de mapas com PHP MySQL e Smarty template.

Desenvolvimento de rotinas para geração de mapa com marcadores utilizando-se linguagem de programação PHP, Smarty Template, banco de dados MySQL e LeafLet.js.

Acesso as rotinas: - Acesso aos mapas https://parabolicamara.com.br/ifsp/leaflet_smarty/.

Resumo dos códigos:

index.tpl
{extends file="layout.tpl"}
{block name=main}

<div class="grid-container">
<div class="coluna1">
<div id="map" style="width: 900px; height: 600px;"></div>
<script>
    var map = L.map('map').setView([{$lat}, {$lon}], 7);

{literal}
    var tiles = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
        maxZoom: 18,
        attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, ' +
            'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
        id: 'mapbox/streets-v11',
        tileSize: 512,
        zoomOffset: -1
    }).addTo(map);
{/literal}

       {section name=i loop=$m_parte}
                 var marker = L.marker([{$m_parte[i].lat}, {$m_parte[i].lng}]).addTo(map) 
                         .bindPopup('<b>{$m_parte[i].name}</b><br />{$m_parte[i].address|escape:"html"}');
       {/section}

    function onMapClick(e) {
        popup
            .setLatLng(e.latlng)
            .setContent('You clicked the map at ' + e.latlng.toString())
            .openOn(map);
    }

    map.on('click', onMapClick);

</script>
</div>
<div class="coluna2">
    <form method="post" action="index.php">

    <div class="row">
        <div class="col-12"
            <label>Modalidade:</label>
            <select name="modalidade" {$f_status_modalidade}>
                {section name=j loop=$modalidade}
                <option value="{$modalidade[j].id}">{$modalidade[j].descricao}</option>
                {/section}
            </select>
            <input type="submit" name="escolher" value="Escolher" {$f_status_modalidade}>
        </div>
    </div>

    <div class="row">
        <div class="col-2>"
            <label>Curso:</label>
            <select name="curso" {$f_status_curso}>
                {section name=k loop=$curso}
                <option value="{$curso[k].id}">{$curso[k].nome}</option>
                {/section}
            </select>
            <input type="submit" name="escolher_curso" value="Escolher">
        </div>
    </div>

    </form>
    <div class="saida">
        <p><strong>{$descricao}</strong></p>
        <ul>
            {section name=j loop=$m_parte}
                <li>{$m_parte[j].name}</li>
            {/section}
        </ul>
    </div>
</div>

<div class="coluna3">
xxxxx
</div>
<div class="coluna4">
xxxxx
</div>
</div>
{/block}
layout.tpl
<!DOCTYPE html>
<html lang="ptBR">
<head>
    <title>{$titulo}</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="./style/mystyle.css" media="all"/> 
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/>
    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
</head>
<body>
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
  <div class="container-fluid">
    <p class="navbar-brand">{$titulo}</p>
  </div>
</nav>
    {block name=main}{/block}
</body>
</html>
index.php
<?php
error_reporting(0);
require 'config/config.php';
require 'db.php';


$f_status_modalidade="active";
$sql="select * from markers order by name";
$return=sql("map", $sql);
while($res=mysqli_fetch_array($return))
{
    $m_todos[]=$res;
}


$sql="select * from fic order by descricao";
$return=sql("map", $sql);
while($res=mysqli_fetch_array($return))
{
    $modalidade[]=$res;
}

if($_POST['escolher']=="Escolher")
    {
        $f_status_modalidade="disabled";
        $sql="select * from curso where fic='".$_POST['modalidade']. "' order by nome";
        $return=sql("map", $sql);
        while($res=mysqli_fetch_array($return))
        {
            $curso[]=$res;
        }
}

if($_POST['escolher_curso']=="Escolher")
    {
        $f_status_modalidade="deactivate";
        $sql="select nome from curso where id='".$_POST['curso']."'";
        $return=sql("map", $sql);
        while($res=mysqli_fetch_assoc($return))
        {
            $nome_curso=$res['nome'];
        }
        $descricao ="Campus que oferecem o curso ".$nome_curso. ":";

        $sql="select * from markers m, tab_curso t where t.id_curso='".$_POST['curso']. "' and t.id_cidade=m.id order by m.name";
        $return=sql("map", $sql);
        while($res=mysqli_fetch_array($return))
        {
            $m_parte[]=$res;
        }
    }

$titulo="Cartografia Digital";
$lat="-22.02485";
$lon="-48.16628";
$smarty->assign('descricao', $descricao);
$smarty->assign('m_parte',$m_parte);
$smarty->assign('modalidade', $modalidade);
$smarty->assign('curso', $curso);
$smarty->assign('titulo',$titulo);
$smarty->assign('f_status_modalidade',$f_status_modalidade);
$smarty->assign('lat',$lat);
$smarty->assign('lon',$lon);
$smarty->display('index.tpl');
?>