Renderen, Opslaan, Het Genoeg Vinden

ReneRubalcava

<\/HEAD>

<\/P>

Onlangs heb ik een beetje gesproken over enkele van de visualisatietools in de ArcGIS API for JavaScript. Recente releases hebben Smart Mapping<\/A> geïntroduceerd, wat het giswerk rond het genereren van renderers op basis van je data vermindert. Ze hebben ook een aantal echt coole functies geïntroduceerd die te maken hebben met het mengen van kleuren<\/A> op basis van de data in je kaart. Het komt op een punt waar ontwikkelaars niet veel excuses meer zullen hebben voor lelijke kaarten<\/EM>.<\/P><\/P>Een ding dat ik zag genoemd bij de EsriUC vorige week<\/A> was het idee om Smart Mapping te gebruiken om je renderer te genereren, er een beetje mee te experimenteren en het te gebruiken om de JSON van de renderer te genereren die je later kunt gebruiken zonder de Smart Mapping tools opnieuw aan te roepen. Dit is volledig mogelijk, maar een beetje onduidelijk hoe je dat zou doen. Laten we dus eens kijken naar een paar technieken die je misschien wilt gebruiken.<\/P>

<\/P>

Lokaal opslaan<\/H2>Misschien staat je app toe dat de gebruiker wat queries uitvoert op de data en een update van de renderer uitvoert op basis van die query. Een voorbeeld rechtstreeks uit de documentatie daarvan zou er zo uit kunnen zien<\/A>. Nou, je kunt een paar extra functies toevoegen aan dit voorbeeld en de renderer opslaan in localStorage. vergelijkbaar met hoe je dat met Features zou kunnen doen<\/A>. Die hulpfuncties zouden er ongeveer zo uit kunnen zien.<\/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>Dan wanneer je Smart Mapping instelt, kun je localStorage controleren op een bestaande renderer en gewoon die opgeslagen renderer gebruiken, waardoor Smart Mapping helemaal wordt omzeild.<\/P><\/P>function createRenderer(field) {
  \/\/_smart mapping functionaliteit begint
  var data = getLocal(field);
  if (data) {
    console.log('renderer laden vanuit localStorage');
    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 opslaan in localStorage');
      saveLocal(response.renderer.toJson(), field);
      layer.setRenderer(response.renderer);
      layer.redraw();
      createLegend(map, layer, field);
    });
  }
}<\/PRE><\/P>Dat is best gaaf.<\/EM> De data in dit voorbeeld is niet al te ingewikkeld, maar je kunt je voorstellen dat als je een grote dataset hebt, het een seconde of zo kan duren voordat Smart Mapping de renderer genereert en deze methode kan een dosis optimalisatie aan je app toevoegen. Hier is een 

volledige demo<\/A> van deze applicatie in actie.<\/P>

<\/P>

Maak een testapplicatie<\/H2>Een ander cool ding dat je kunt doen is een testapp maken vergelijkbaar met dit voorbeeld<\/A>.  Dan kun je een <pre><\/SPAN>-tag aan je pagina toevoegen en deze bijwerken met de JSON van de renderers wanneer deze wordt bijgewerkt. De code kan er ongeveer zo uitzien.<\/P><\/P>var data = colorRenderer.renderer.toJson();
var js = JSON.stringify(data, null, 2);
document.getElementById('results').innerHTML = js;<\/PRE><\/P>Dus nu kun je deze JSON direct vanaf je webpagina kopiëren en plakken en zou je het kunnen gebruiken in een lokale configuratie die mogelijk de webmap-specificatie<\/A> gebruikt. Nu hoef je je geen zorgen meer te maken over het gebruik van Smart Mapping in een productie-app die het misschien niet nodig heeft, het heeft alleen de coole renderers nodig die het kan genereren. Hier is een demo-app<\/A> die laat zien hoe je dit zou kunnen doen.<\/P>

<\/P>

Ga naar huis<\/H2>Zo zie je maar, je hebt nu een paar manieren om je renderers te genereren, ze op te slaan en ze te gebruiken in je apps om prestaties te optimaliseren wanneer dat nodig is. De visualisatietools in de ArcGIS API for JavaScript zijn door de jaren heen flink verbeterd en ik denk dat het ontwikkelaars behoorlijk goede hulpmiddelen geeft om coole kaarten voor hun apps te maken. <\/>\/>Je bent klaar, je mag nu naar huis gaan.<\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>\/><\/>