<div dir="ltr">Hi, <div><p style="margin:0px 0px 1em;padding:0px;border:0px;font-size:15px;clear:both;color:rgb(36,39,41);font-family:arial,"helvetica neue",helvetica,sans-serif;background-color:rgba(248,248,248,0.6)">'m having troubles using utfgrid module with openlayers. The implementation on Mapserver's side is quite simple, even if i have doubts about the imagetype :</p><pre class="inbox-inbox-lang-js inbox-inbox-prettyprint inbox-inbox-prettyprinted" style="margin-top:0px;margin-bottom:1em;padding:5px;border:0px;font-size:13px;width:auto;max-height:600px;overflow:auto;font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace,sans-serif;background-color:rgb(239,240,241);color:rgb(57,51,24);word-wrap:normal"><code style="margin:0px;padding:0px;border:0px;font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace,sans-serif;white-space:inherit"><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">MAP
    IMAGETYPE   UTFGRID
    SIZE        </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">2000</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">2000</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    CONFIG </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"MS_ERRORFILE"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"/ms4w/tmp/ms_error.txt"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">#</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">DEBUG </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">4</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    EXTENT </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">-</span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">176.197</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">-</span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">31.0869</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">181.47</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">81.8381</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    NAME </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"allexmaple"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">

PROJECTION
    </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"init=epsg:4326"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
END 
QUERYMAP
    STATUS ON
END
OUTPUTFORMAT
    NAME </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"utfgrid"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    DRIVER UTFGRID
    MIMETYPE </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"application/json"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    EXTENSION </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"json"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    FORMATOPTION </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"UTFRESOLUTION=4"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    FORMATOPTION </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"DUPLICATES=false"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
END
WEB
    IMAGEPATH </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"tmp/"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    IMAGEURL </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"tmp/"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
END
SYMBOL
    NAME </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"mysymbol"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    TYPE pixmap
    ANCHORPOINT </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">0.5</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">0.5</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    IMAGE  </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"icons/mysymbol.png"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
END 

LAYER
    TOLERANCE </span><span class="inbox-inbox-lit" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">10</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    CONNECTIONTYPE postgis 
    NAME </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"example"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    CONNECTION </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"host=127.0.0.1 dbname=ais_data user=postgres password=admin port=5432"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    DATA </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"geom from mytable using srid=4326"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    STATUS ON
    TYPE POINT
    UTFITEM   </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"id"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    UTFDATA   </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"{\"id\":\"[id]\",\"name\":\"[name]\"}"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    TEMPLATE </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">'query.html'</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    HEADER </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">'header.html'</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    FOOTER </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">'footer.html'</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
    CLASSITEM </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"ct"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">

    CLASS
        EXPRESSION </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">"mysymbol"</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
        STYLE
            ANGLE </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">[</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">angle</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">]</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
            SYMBOL </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">'mysymbol'</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> 
        END </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">#</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> style 
    END </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">#</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-kwd" style="margin:0px;padding:0px;border:0px;color:rgb(16,16,148)">class</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> 
END</span></code></pre><p style="margin:0px 0px 1em;padding:0px;border:0px;font-size:15px;clear:both;color:rgb(36,39,41);font-family:arial,"helvetica neue",helvetica,sans-serif;background-color:rgba(248,248,248,0.6)">END</p><p style="margin:0px 0px 1em;padding:0px;border:0px;font-size:15px;clear:both;color:rgb(36,39,41);font-family:arial,"helvetica neue",helvetica,sans-serif;background-color:rgba(248,248,248,0.6)">Openlayers, on the other hand, doesn't have efficient example. I don't know what to provide in my url. Here's what I tried:</p><pre class="inbox-inbox-lang-js inbox-inbox-prettyprint inbox-inbox-prettyprinted" style="margin-top:0px;margin-bottom:1em;padding:5px;border:0px;font-size:13px;width:auto;max-height:600px;overflow:auto;font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace,sans-serif;background-color:rgb(239,240,241);color:rgb(57,51,24);word-wrap:normal"><code style="margin:0px;padding:0px;border:0px;font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace,sans-serif;white-space:inherit"><span class="inbox-inbox-kwd" style="margin:0px;padding:0px;border:0px;color:rgb(16,16,148)">var</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> gridSource </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">=</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-kwd" style="margin:0px;padding:0px;border:0px;color:rgb(16,16,148)">new</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> ol</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">.</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">source</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">.</span><span class="inbox-inbox-typ" style="margin:0px;padding:0px;border:0px;color:rgb(43,145,175)">TileUTFGrid</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">({</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
       url</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">:</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-str" style="margin:0px;padding:0px;border:0px;color:rgb(125,39,39)">'<a href="http://localhost:5000/cgi-bin/mapserv.exe?map=/ms4w/apps/tutorial/htdocs/essai.map&layers=example&tiled=true&mode=map&type=utfgrid&format=application/json">http://localhost:5000/cgi-bin/mapserv.exe?map=/ms4w/apps/tutorial/htdocs/essai.map&layers=example&tiled=true&mode=map&type=utfgrid&format=application/json</a>'</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
      </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">});</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
 </span><span class="inbox-inbox-kwd" style="margin:0px;padding:0px;border:0px;color:rgb(16,16,148)">var</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> mySuperLayer </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">=</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> </span><span class="inbox-inbox-kwd" style="margin:0px;padding:0px;border:0px;color:rgb(16,16,148)">new</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> ol</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">.</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">layer</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">.</span><span class="inbox-inbox-typ" style="margin:0px;padding:0px;border:0px;color:rgb(43,145,175)">Tile</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">({</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">
           source</span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">:</span><span class="inbox-inbox-pln" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)"> gridSource
      </span><span class="inbox-inbox-pun" style="margin:0px;padding:0px;border:0px;color:rgb(48,51,54)">});</span></code></pre><p style="margin:0px 0px 1em;padding:0px;border:0px;font-size:15px;clear:both;color:rgb(36,39,41);font-family:arial,"helvetica neue",helvetica,sans-serif;background-color:rgba(248,248,248,0.6)">But nothing appears and my url stays in pending until timeout<br><br>I just don't know how to debug that, any help would be highly appreciated</p></div></div>