Rendern, Speichern, Feierabend machen

ReneRubalcava

<\/HEAD>

<\/P>

Kürzlich habe ich ein wenig über einige der Visualisierungstools in der ArcGIS API for JavaScript gesprochen. Neuere Versionen haben Smart Mapping<\/A> eingeführt, das einen Teil der Vermutungen bei der Erstellung von Renderern basierend auf Ihren Daten übernimmt. Sie haben auch einige wirklich coole Funktionen eingeführt, die sich mit dem Mischen von Farben<\/A> basierend auf den Daten in Ihrer Karte befassen. Es kommt an den Punkt, an dem Entwickler kaum noch Ausreden für hässliche Karten haben werden<\/EM>.<\/P><\/P>Eines der Dinge, die ich letzte Woche auf der EsriUC<\/A> gesehen habe, war die Idee, Smart Mapping zu verwenden, um Ihren Renderer zu generieren, ein wenig damit zu experimentieren und es zu nutzen, um das JSON des Renderers zu erzeugen, das Sie später verwenden können, ohne die Smart Mapping-Tools erneut aufzurufen. Das ist völlig machbar, aber etwas unklar, wie man es genau macht. Schauen wir uns also ein paar Techniken an, die Sie verwenden könnten.<\/P>

<\/P>

Lokal speichern<\/H2>Vielleicht erlaubt Ihre App dem Benutzer, einige Abfragen auf den Daten durchzuführen und den Renderer basierend auf dieser Abfrage zu aktualisieren. Ein Beispiel direkt aus der Dokumentation könnte so aussehen<\/A>. Nun, Sie können diesem Beispiel ein paar weitere Funktionen hinzufügen und den Renderer im localStorage speichern. ähnlich wie Sie es mit Features tun könnten<\/A>. Diese Hilfsfunktionen könnten ungefähr so aussehen.<\/P>

<\/P>

function saveLocal(data, field) {
  var key = location.pathname + '-' + field;
  localStorage.setItem(key, JSON.stringify(data));
}

function getLocal(field) {
  var key = location.pathname + '-' + field;
  var data = localStorage.getItem(key);
  if (data) {
    return JSON.parse(data);
  } else {
    return null;
  }
}<\/PRE><\/P>Wenn Sie dann Smart Mapping einrichten, könnten Sie im localStorage nach einem vorhandenen Renderer suchen und einfach diesen gespeicherten Renderer verwenden und Smart Mapping komplett umgehen.<\/P><\/P>function createRenderer(field) {
  \/\/_smart mapping-Funktionalität beginnt
  var data = getLocal(field);
  if (data) {
    console.log('Renderer aus localStorage laden');
    layer.setRenderer(jsonUtils.fromJson(data));
    layer.redraw();
    createLegend(map, layer, field);
  } else {
    smartMapping.createClassedColorRenderer({
      layer: layer,
      field: field,
      basemap: map.getBasemap(),
      classificationMethod: "quantile"
    }).then(function (response) {
      console.log('Renderer im localStorage speichern');
      saveLocal(response.renderer.toJson(), field);
      layer.setRenderer(response.renderer);
      layer.redraw();
      createLegend(map, layer, field);
    });
  }
}<\/PRE><\/P>Das ist ziemlich cool.<\/EM> Die Daten in diesem Beispiel sind nicht allzu kompliziert, aber man kann sich vorstellen, dass wenn man einen großen Datensatz hat, es eine Sekunde oder so dauern kann, bis Smart Mapping den Renderer generiert hat und diese Methode könnte Ihrer App eine Optimierung bringen. Hier ist eine 

vollständige Demo<\/A> dieser Anwendung in Aktion.<\/P>

<\/P>

Erstellen Sie eine Test-App<\/H2>Eine weitere coole Sache wäre es, eine Test-App ähnlich wie diesem Beispiel<\/A> zu erstellen.  Dann können Sie Ihrer Seite ein <pre><\/SPAN>-Tag hinzufügen und es mit dem JSON des Renderers aktualisieren, wenn dieser aktualisiert wird. Der Code könnte ungefähr so aussehen.<\/P><\/P>var data = colorRenderer.renderer.toJson();
var js = JSON.stringify(data, null, 2);
document.getElementById('results').innerHTML = js;<\/PRE><\/P>Jetzt können Sie dieses JSON direkt von Ihrer Webseite kopieren und in einer lokalen Konfiguration verwenden, die die webmap-Spezifikation<\/A> nutzt. So müssen Sie sich keine Sorgen machen, Smart Mapping in einer Produktions-App zu verwenden, die es vielleicht nicht braucht – sie benötigt nur die cool aussehenden Renderer, die es erzeugen kann. Hier ist eine Demo-App<\/A>, die zeigt, wie man das machen könnte.<\/P>

<\/P>

Nach Hause gehen<\/H2>Da haben Sie es also – Sie haben jetzt ein paar Möglichkeiten Ihren Renderer zu generieren, zu speichern und in Ihren Apps zu verwenden, um bei Bedarf die Leistung zu optimieren. Die Visualisierungstools in der ArcGIS API for JavaScript haben sich über die Jahre stark weiterentwickelt und ich denke, sie bieten Entwicklern ziemlich gute Ressourcen für coole Karten für ihre Apps.

Sie sind fertig, Sie können jetzt nach Hause gehen.
Für mehr geodev Tipps und Tricks besuchen Sie meinen Blog<\/_a>.<\/_p>