GeoHelm/app/latest/apps/php.html

506 lines
22 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" >
<!-- Mirrored from geohelm.docs.acugis.com/en/latest/apps/php.html by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 13 Jul 2023 23:23:25 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Leaflet and PHP &mdash; AcuGIS GeoHelm 0.4.3 documentation</title>
<!-- AcuGIS 1 -->
<!--[if lt IE 9]>
<script src="../_static/js/html5shiv.min.js"></script>
<![endif]-->
<script type="text/javascript" id="documentation_options" data-url_root="../" src="../_static/documentation_options.js"></script>
<script type="text/javascript" src="../_static/jquery.js"></script>
<script type="text/javascript" src="../_static/underscore.js"></script>
<script type="text/javascript" src="../_static/doctools.js"></script>
<script type="text/javascript" src="../_static/language_data.js"></script>
<script async="async" type="text/javascript" src="../../../_/static/javascript/readthedocs-doc-embed.js"></script>
<script type="text/javascript" src="../_static/js/theme.js"></script>
<link rel="stylesheet" href="../_static/css/theme.css" type="text/css" />
<link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
<link rel="stylesheet" href="../_static/custom.css" type="text/css" />
<link rel="index" title="Index" href="../genindex.html" />
<link rel="search" title="Search" href="../search.html" />
<link rel="next" title="Documentation" href="../resources/documents.html" />
<link rel="prev" title="Leaflet GeoJson" href="geojson.html" />
<!-- RTD Extra Head -->
<link rel="stylesheet" href="../../../_/static/css/readthedocs-doc-embed.css" type="text/css" />
<script type="application/json" id="READTHEDOCS_DATA">{"ad_free": false, "api_host": "https://readthedocs.org", "builder": "sphinx", "canonical_url": null, "docroot": "/docs/", "features": {"docsearch_disabled": false}, "global_analytics_code": "UA-17997319-1", "language": "en", "page": "apps/php", "programming_language": "perl", "project": "geohelm", "proxied_api_host": "/_", "source_suffix": ".rst", "subprojects": {}, "theme": "sphinx_rtd_theme", "user_analytics_code": "", "version": "latest"}</script>
<!--
Using this variable directly instead of using `JSON.parse` is deprecated.
The READTHEDOCS_DATA global variable will be removed in the future.
-->
<script type="text/javascript">
READTHEDOCS_DATA = JSON.parse(document.getElementById('READTHEDOCS_DATA').innerHTML);
</script>
<script type="text/javascript" src="../../../_/static/javascript/readthedocs-analytics.js" async="async"></script>
<!-- end RTD <extrahead> -->
</head>
<div id="header" style="position: fixed; height: 70px; padding-bottom: 20px; overflow: hidden; background-color: #28728d; display: block; z-index: 1000; width: 100%;">
<div class="acugis_geosuite" style="color:#fff!important; padding-left:30px; font-size:26px; padding-top: 20px;"><a href="https://geohelm.docs.acugis.com/" style="color:#fff!important; text-decoration:none!important">AcuGIS GeoHelm</a></div>
</div>
</div>
<body class="wy-body-for-nav">
<div class="wy-grid-for-nav">
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
<div class="wy-side-scroll">
<div id="header2"> </div>
<div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation" style="padding-top: 45px;">
<p class="caption"><span class="caption-text">Getting Started</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../intro.html">Intro</a></li>
<li class="toctree-l1"><a class="reference internal" href="../installing.html">Installation</a></li>
<li class="toctree-l1"><a class="reference internal" href="../layout.html">Layout</a></li>
<li class="toctree-l1"><a class="reference internal" href="../webmin.html">Control Panel</a></li>
<li class="toctree-l1"><a class="reference internal" href="../webmin.html#removing-the-control-panel">Removing the Control Panel</a></li>
</ul>
<p class="caption"><span class="caption-text">PostGIS</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../components/createdb/index.html">Create Database</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/postgresql/index.html">PostgreSQL</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/postgis/index.html">PostGIS</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/pgrouting/index.html">PgRouting</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/shp2pgsql/index.html">shp2pgsql</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/osm2pgsql/index.html">osm2pgsql</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/raster2pgsql/index.html">raster2pgsql</a></li>
</ul>
<p class="caption"><span class="caption-text">GeoServer</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/admin/index.html">Access</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/geoservers/index.html">Overview</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/tomcat/index.html">Apache Tomcat</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/workspace/index.html">Create a Workspace</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/store/index.html">Create Store</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/layer/index.html">Add Layer</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/shp/index.html">Load ESRI Shapefile</a></li>
<li class="toctree-l1"><a class="reference internal" href="../geoserver/styles/index.html">Styles</a></li>
</ul>
<p class="caption"><span class="caption-text">pg_tileserv</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../components/pgtileserv/index.html">pg_tileserv</a></li>
<li class="toctree-l1"><a class="reference internal" href="../components/pgfeatureserv/index.html">pg_featureserv</a></li>
</ul>
<p class="caption"><span class="caption-text">Database Operations</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../database/snapshot/index.html">Database Snapshots</a></li>
<li class="toctree-l1"><a class="reference internal" href="../database/clone/index.html">Clone Database</a></li>
<li class="toctree-l1"><a class="reference internal" href="../database/restore/index.html">Restore Database</a></li>
</ul>
<p class="caption"><span class="caption-text">QGIS</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../qgis/home.html">Introduction</a></li>
<li class="toctree-l1"><a class="reference internal" href="../qgis/pgservice.html">pg_service.conf</a></li>
<li class="toctree-l1"><a class="reference internal" href="../qgis/qgis.html">Create a QGIS Project</a></li>
<li class="toctree-l1"><a class="reference internal" href="../qgis/publish.html">Publish Layers</a></li>
<li class="toctree-l1"><a class="reference internal" href="../qgis/style-only.html">Publish Styles Only</a></li>
</ul>
<p class="caption"><span class="caption-text">LeafletJS</span></p>
<ul class="current">
<li class="toctree-l1"><a class="reference internal" href="choropleth.html">Leaflet Choropleth App</a></li>
<li class="toctree-l1"><a class="reference internal" href="geojson.html">Leaflet GeoJson</a></li>
<li class="toctree-l1 current"><a class="current reference internal" href="#">Leaflet and PHP</a><ul>
<li class="toctree-l2"><a class="reference internal" href="#access">Access</a></li>
<li class="toctree-l2"><a class="reference internal" href="#initialize">Initialize</a></li>
<li class="toctree-l2"><a class="reference internal" href="#security">Security</a></li>
<li class="toctree-l2"><a class="reference internal" href="#structure">Structure</a></li>
<li class="toctree-l2"><a class="reference internal" href="#content">Content</a></li>
<li class="toctree-l2"><a class="reference internal" href="#documentation">Documentation</a></li>
</ul>
</li>
</ul>
<p class="caption"><span class="caption-text">Resources</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../resources/documents.html">Documentation</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/css.html">CSS</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/security.html">Security</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/nagios.html">Nagios</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/support.html">Project Support</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/commercial.html">Commercial Support</a></li>
<li class="toctree-l1"><a class="reference internal" href="../resources/license.html">License</a></li>
</ul>
</div>
</div>
</nav>
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
<nav class="wy-nav-top" aria-label="top navigation">
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
<a href="../index-2.html">AcuGIS GeoHelm</a>
</nav>
<div class="wy-nav-content">
<div class="rst-content">
<div role="navigation" aria-label="breadcrumbs navigation">
<ul class="wy-breadcrumbs">
<li><a href="../index-2.html" class="icon icon-home"></a> &raquo;</li>
<li>Leaflet and PHP</li>
<li class="wy-breadcrumbs-aside">
<a href="https://github.com/AcuGIS/GeoHelm/blob/master/docs/apps/php.rst" class="fa fa-github"> Edit on GitHub</a>
</li>
</ul>
<hr/>
</div>
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
<div itemprop="articleBody">
<div class="section" id="leaflet-and-php">
<h1><a class="toc-backref" href="#id1">Leaflet and PHP</a><a class="headerlink" href="#leaflet-and-php" title="Permalink to this headline"></a></h1>
<div class="contents topic" id="table-of-contents">
<p class="topic-title">Table of Contents</p>
<ul class="simple">
<li><a class="reference internal" href="#leaflet-and-php" id="id1">Leaflet and PHP</a><ul>
<li><a class="reference internal" href="#access" id="id2">Access</a></li>
<li><a class="reference internal" href="#initialize" id="id3">Initialize</a></li>
<li><a class="reference internal" href="#security" id="id4">Security</a></li>
<li><a class="reference internal" href="#structure" id="id5">Structure</a></li>
<li><a class="reference internal" href="#content" id="id6">Content</a></li>
<li><a class="reference internal" href="#documentation" id="id7">Documentation</a></li>
</ul>
</li>
</ul>
</div>
<div class="section" id="access">
<h2><a class="toc-backref" href="#id2">Access</a><a class="headerlink" href="#access" title="Permalink to this headline"></a></h2>
<p>A web application employing PostGIS, PHP, and LeafletJS.</p>
<p>This application uses the PHP-Database-GeoJSON file from <a class="reference external" href="https://github.com/bmcbride/PHP-Database-GeoJSON">https://github.com/bmcbride/PHP-Database-GeoJSON</a></p>
<p>It can be access via <a class="reference external" href="http://domain.com/LeafletPHPDemo.html">http://domain.com/LeafletPHPDemo.html</a></p>
<img alt="../_images/leaflet-geojson-europe.png" src="../_images/leaflet-geojson-europe.png" />
</div>
<div class="section" id="initialize">
<h2><a class="toc-backref" href="#id3">Initialize</a><a class="headerlink" href="#initialize" title="Permalink to this headline"></a></h2>
<p>If you any issues connecting to PostGIS, check line 12 of get-json.phpbelow:</p>
<blockquote>
<div>$conn = new PDO(pgsql:host=localhost;dbname=postgisftw,pgis,&lt;YourPgisPassword&gt;);</div></blockquote>
<p>Replace &lt;YourPgisPassword&gt; with the password for user pgis.</p>
<p>The password for user pgis is auto-generated and can be found at /home/pgis/.pgpass</p>
</div>
<div class="section" id="security">
<h2><a class="toc-backref" href="#id4">Security</a><a class="headerlink" href="#security" title="Permalink to this headline"></a></h2>
<p>This map loads GeoJson generated from PostGIS directly and does not employ the pg_featurserv or GeoServer urls.</p>
<p>As you may have noticed, it is identical to our LeafletGeoJson.html map except for the GeoJson source url.</p>
<p>While urls for pg_featurserv and GeoServer can be secured, the url will always be exposed to your users as it is required for map rendering.</p>
<p>Conversely, the PostGIS PHP application uses the get-json.php file to establish a connection to PostGIS in the background.</p>
<p>You can employ the same method for loading GeoJson from pg_featurserv, GeoServer, or any other json url.</p>
<p>There is performance penalty, however, as the GeoJson is loaded into the end users browser and for large data sets, this can become extremely slow.</p>
</div>
<div class="section" id="structure">
<h2><a class="toc-backref" href="#id5">Structure</a><a class="headerlink" href="#structure" title="Permalink to this headline"></a></h2>
<p>The app is located at:</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="o">/</span><span class="n">vaw</span><span class="o">/</span><span class="n">www</span><span class="o">/</span><span class="n">html</span><span class="o">/</span><span class="n">LeafletPHPDemo</span><span class="o">.</span><span class="n">html</span>
</pre></div>
</div>
<p>This is just a basic Leafletjs map in which we are pulling in geojson from get-json.php:</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span>$.getJSON(&quot;get-json.php&quot;, function(data) {
</pre></div>
</div>
</div>
<div class="section" id="content">
<h2><a class="toc-backref" href="#id6">Content</a><a class="headerlink" href="#content" title="Permalink to this headline"></a></h2>
<p>The content of the html page is displayed below.</p>
<div class="highlight-console notranslate"><div class="highlight"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span class="normal"> 1</span>
<span class="normal"> 2</span>
<span class="normal"> 3</span>
<span class="normal"> 4</span>
<span class="normal"> 5</span>
<span class="normal"> 6</span>
<span class="normal"> 7</span>
<span class="normal"> 8</span>
<span class="normal"> 9</span>
<span class="normal">10</span>
<span class="normal">11</span>
<span class="normal">12</span>
<span class="normal">13</span>
<span class="normal">14</span>
<span class="normal">15</span>
<span class="normal">16</span>
<span class="normal">17</span>
<span class="normal">18</span>
<span class="normal">19</span>
<span class="normal">20</span>
<span class="normal">21</span>
<span class="normal">22</span>
<span class="normal">23</span>
<span class="normal">24</span>
<span class="normal">25</span>
<span class="normal">26</span>
<span class="normal">27</span>
<span class="normal">28</span>
<span class="normal">29</span>
<span class="normal">30</span>
<span class="normal">31</span>
<span class="normal">32</span>
<span class="normal">33</span>
<span class="normal">34</span>
<span class="normal">35</span>
<span class="normal">36</span>
<span class="normal">37</span>
<span class="normal">38</span>
<span class="normal">39</span>
<span class="normal">40</span>
<span class="normal">41</span>
<span class="normal">42</span>
<span class="normal">43</span>
<span class="normal">44</span>
<span class="normal">45</span>
<span class="normal">46</span>
<span class="normal">47</span>
<span class="normal">48</span>
<span class="normal">49</span>
<span class="normal">50</span>
<span class="normal">51</span>
<span class="normal">52</span>
<span class="normal">53</span>
<span class="normal">54</span></pre></div></td><td class="code"><div><pre><span></span><span class="go"> &lt;!doctype html&gt;</span>
<span class="go"> &lt;html&gt;</span>
<span class="go"> &lt;head&gt;</span>
<span class="go"> &lt;style type=&quot;text/css&quot;&gt;</span>
<span class="go"> body {</span>
<span class="go"> padding: 0;</span>
<span class="go"> margin: 0;</span>
<span class="go"> }</span>
<span class="go"> html, body, #map {</span>
<span class="go"> height: 100%;</span>
<span class="go"> }</span>
<span class="go"> &lt;/style&gt;</span>
<span class="go"> &lt;link rel=&quot;stylesheet&quot; href=&quot;https://unpkg.com/leaflet@1.1.0/dist/leaflet.css&quot;</span>
<span class="go"> integrity=&quot;sha512-wcw6ts8Anuw10Mzh9Ytw4pylW8+NAD4ch3lqm9lzAsTxg0GFeJgoAtxuCLREZSC5lUXdVyo/7yfsqFjQ4S+aKw==&quot;</span>
<span class="go"> crossorigin=&quot;&quot;/&gt;</span>
<span class="go"> &lt;script src=&quot;https://unpkg.com/leaflet@1.1.0/dist/leaflet.js&quot;</span>
<span class="go"> integrity=&quot;sha512-mNqn2Wg7tSToJhvHcqfzLMU6J4mkOImSPTxVZAdo+lcPlk+GhZmYgACEe0x35K7YzW1zJ7XyJV/TT1MrdXvMcA==&quot;</span>
<span class="go"> crossorigin=&quot;&quot;&gt;&lt;/script&gt;</span>
<span class="go"> &lt;/head&gt;</span>
<span class="go"> &lt;script src=&quot;http://code.jquery.com/jquery-2.1.0.min.js&quot;&gt;&lt;/script&gt;</span>
<span class="go"> &lt;/head&gt;</span>
<span class="go"> &lt;body&gt;</span>
<span class="go"> &lt;div id=&quot;map&quot;&gt;&lt;/div&gt;</span>
<span class="go"> &lt;script&gt;</span>
<span class="go"> var osmUrl=&#39;http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png&#39;;</span>
<span class="go"> var osmAttrib=&#39;Data &amp;copy &lt;a href=&quot;http://openstreetmap.org&quot;&gt;OpenStreetMap&lt;/a&gt; contributors&#39;;</span>
<span class="go"> var osm = new L.TileLayer(osmUrl, {minZoom: 2, maxZoom: 8, attribution: osmAttrib});</span>
<span class="gp"> $</span>.getJSON<span class="o">(</span><span class="s2">&quot;get-json.php&quot;</span>,<span class="w"> </span><span class="k">function</span><span class="o">(</span>data<span class="o">)</span><span class="w"> </span><span class="o">{</span>
<span class="go"> function onEachFeature(feature, layer) {</span>
<span class="go"> layer.bindPopup(&quot;Name: &quot; + feature.properties.name + &quot;&lt;br&gt;&quot; + &quot;Abbreviation: &quot; + feature.properties.abbrev);</span>
<span class="go"> }</span>
<span class="go"> var geojson = L.geoJson(data, {</span>
<span class="go"> onEachFeature: onEachFeature</span>
<span class="go"> });</span>
<span class="go"> var map = L.map(&#39;map&#39;).fitBounds(geojson.getBounds());</span>
<span class="go"> osm.addTo(map);</span>
<span class="go"> geojson.addTo(map);</span>
<span class="go"> });</span>
<span class="go"> &lt;/script&gt;</span>
<span class="go"> &lt;/body&gt;</span>
<span class="go"> &lt;/html&gt;</span>
</pre></div></td></tr></table></div>
</div>
</div>
<div class="section" id="documentation">
<h2><a class="toc-backref" href="#id7">Documentation</a><a class="headerlink" href="#documentation" title="Permalink to this headline"></a></h2>
<p><a class="reference external" href="https://leafletjs.com/">https://leafletjs.com/</a></p>
<p><a class="reference external" href="https://leafletjs.com/examples/geojson/">https://leafletjs.com/examples/geojson/</a></p>
</div>
</div>
</div>
</div>
<footer>
<div class="rst-footer-buttons" role="navigation" aria-label="footer navigation">
<a href="../resources/documents.html" class="btn btn-neutral float-right" title="Documentation" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right"></span></a>
<a href="geojson.html" class="btn btn-neutral float-left" title="Leaflet GeoJson" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left"></span> Previous</a>
</div>
<hr/>
<div role="contentinfo">
<p>
&copy; Copyright acugis
<span class="commit">
Revision <code>db2a027e</code>.
</span>
</p>
</div>
Built with <a href="http://sphinx-doc.org/">Sphinx</a> using a <a href="https://github.com/rtfd/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org/">Read the Docs</a>.
</footer>
</div>
</div>
</section>
</div>
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
<span class="rst-current-version" data-toggle="rst-current-version">
<span class="fa fa-book"> Read the Docs</span>
v: latest
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Versions</dt>
<dd><a href="../index.html">latest</a></dd>
</dl>
<dl>
<dt>Downloads</dt>
<dd><a href="http://geohelm.docs.acugis.com/_/downloads/en/latest/pdf/">pdf</a></dd>
<dd><a href="http://geohelm.docs.acugis.com/_/downloads/en/latest/htmlzip/">html</a></dd>
<dd><a href="http://geohelm.docs.acugis.com/_/downloads/en/latest/epub/">epub</a></dd>
</dl>
<dl>
<dt>On Read the Docs</dt>
<dd>
<a href="http://readthedocs.org/projects/geohelm/?fromdocs=geohelm">Project Home</a>
</dd>
<dd>
<a href="http://readthedocs.org/builds/geohelm/?fromdocs=geohelm">Builds</a>
</dd>
</dl>
</div>
</div>
<script type="text/javascript">
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
<!-- Mirrored from geohelm.docs.acugis.com/en/latest/apps/php.html by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 13 Jul 2023 23:23:25 GMT -->
</html>