Best tools for multimedia reporting Fri, 29 Jul 2016 17:16:01 +0000 en-US hourly 1 https://s0.wp.com/i/webclip.png 32 32 239681374 https://geojournalism.org/2015/02/making-maps-with-jeo/ Willie Shubert Wed, 04 Feb 2015 17:55:42 +0000 Apps Design Maps cartography environmental data https://geojournalism.org/?p=1335 <p>The basic component of a map is its layers&#8212;an individually designed dataset&#8212;that are combined together to tell a story. In JEO 1.o and beyond, maps&#160;are built&#160;utilizing a&#160;layers content type which allows editors to more easily reuse the data they mapped. &#160;These layers are organized and configured in combination with a base map that usually consists [&#8230;]</p> <p>The post <a href="https://geojournalism.org/2015/02/making-maps-with-jeo/">Making Maps with JEO</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> <p>The basic component of a map is its layers—an individually designed dataset—that are combined together to tell a story. In JEO 1.o and beyond, maps are built utilizing a layers content type which allows editors to more easily reuse the data they mapped.  These layers are organized and configured in combination with a base map that usually consists of place names, roads, and major natural features.</p> <div class="wp-caption aligncenter" id="attachment_1337" style="width: 570px"><a href="https://geojournalism.org/wp-content/uploads/2015/02/Ekuatorial_Marine_Traffic.png"><img alt="Map of marine traffic in the Java Sea published by geojournalism project Ekuatorial" aria-describedby="caption-attachment-1337" class="wp-image-1337" decoding="async" fetchpriority="high" height="376" src="https://geojournalism.org/wp-content/uploads/2015/02/Ekuatorial_Marine_Traffic.png" width="560"/></a><p class="wp-caption-text" id="caption-attachment-1337">Map of marine traffic in the Java Sea published by geojournalism project Ekuatorial. The basemap focuses on the readers attention on the ocean areas of the map and is used to contexualize data layers showing shipping lanes and marine protected areas.</p></div> <h1 class="summary-item" id="add-a-new-layer"><a href="#add-a-new-layer"> Add a New Layer</a></h1> <p>JEO’s maps are created by stacking one or more custom thematic layers on top of a basemap. A thematic layer is made from a dataset that illustrates and provides context to the map. Layers are displayed as tiles that are hosted on external servers and connected with the JEO template through APIs and URLs.</p> <p>To add more layers, you can use the “Add MapBox layer” and “Add CartoDB layer” buttons if you want to use layers from these servers. Otherwise, use “Add tile layer.” Inside the box that is created after adding a layer you’ll see three fields that need to be filled out:</p> <ul> <li>Title, which is the name of your layer. It will always be used when you need to refer to this layer (in a menu, for example).</li> <li>ID or URL. This is where you should put the URL of the layer, or, in the case of a MapBox layer, your ID.</li> </ul> <p> </p> <div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Add a Tile Layer </a></li> <li><a href="#"> Add a MapBox Layer </a></li> <li><a href="#"> Add a CartoDB Layer </a></li> <li><a href="#"> Add a Layer Legend </a></li> </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> <a href="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.56-PM.png"><img alt="Screen Shot 2016-03-16 at 3.17.56 PM" class="alignnone size-medium wp-image-1569" decoding="async" height="276" sizes="(max-width: 300px) 100vw, 300px" src="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.56-PM-300x276.png" srcset="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.56-PM-300x276.png 300w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.56-PM-1024x943.png 1024w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.56-PM.png 1440w" width="300"/></a> </div> <div class="et_slidecontent"> <img alt="Screen Shot 2016-03-16 at 3.18.02 PM" class="alignnone size-medium wp-image-1570" decoding="async" height="95" sizes="(max-width: 300px) 100vw, 300px" src="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.02-PM-300x95.png" srcset="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.02-PM-300x95.png 300w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.02-PM-1024x325.png 1024w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.02-PM.png 1424w" width="300"/> </div> <div class="et_slidecontent"> <a href="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.08-PM.png"><img alt="Screen Shot 2016-03-16 at 3.18.08 PM" class="alignnone size-medium wp-image-1571" decoding="async" height="137" loading="lazy" sizes="auto, (max-width: 300px) 100vw, 300px" src="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.08-PM-300x137.png" srcset="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.08-PM-300x137.png 300w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.08-PM-1024x467.png 1024w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.08-PM.png 1418w" width="300"/></a> </div> <div class="et_slidecontent"> <a href="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.31-PM.png"><img alt="Screen Shot 2016-03-16 at 3.18.31 PM" class="alignnone size-medium wp-image-1572" decoding="async" height="300" loading="lazy" sizes="auto, (max-width: 261px) 100vw, 261px" src="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.31-PM-261x300.png" srcset="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.31-PM-261x300.png 261w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.18.31-PM.png 552w" width="261"/></a> </div> </div> </div> </div> .et-tabs-container <p>Each layer contains a field for adding the legend to describes the dataset and show how it is symbolized. The legend needs to be written in HTML and is flexible to accept a number of custom styles. Please see this the InfoAmazonia, Ekuatorial, or Third Pole github repository for some example of how these are written.</p> <h1 class="summary-item" id="add-a-new-map"><a href="#add-a-new-map">Add a New Map</a></h1> <p>JEO’s maps are created by stacking one or more custom thematic layers on top of a base map. The Maps Content Type is there location where layers are named and organized into Maps. This is done by configuring the “Maps Setup” section of the form. The basic component of a map is its layers—an individually designed dataset—that are combined together to tell a story. These layers are organized and configured in combination with a base map that usually consists of place names, roads, and major natural features.</p> <h1 class="summary-item" id="choose-a-base-layer"><a href="#choose-a-base-layer">Choose a Base Layer</a></h1> <p>The base layer is the layer is bottom most layer in your map; providing a visual foundation for all of the data added on top. There are a variety of already created base maps you can choose from, including:</p> <ul> <li>OpenStreetMap,</li> <li>Mapquest,</li> <li>Mapquest Satellite,</li> <li>Stamen Toner,</li> <li>Stamen Watercolour,</li> <li>Stamen Terrain,</li> <li>Other (used for when you have your own tilelayer URL)</li> <li>None (in case you want to use a base from an already existing layer in your website).</li> </ul> <h1 class="summary-item" id="add-and-organize-thematic-layers"><a href="#add-and-organize-thematic-layers">Add and Organize Thematic Layers</a></h1> <p>The design of the map is closely related to its order of information. One of the most important concepts in cartography is called visual hierarchy. The idea is focused on making the most important information the most visually prominent in the design. Once you’ve identified the most important information you put it on the top and add supporting data underneath.</p> <p>For example a deforestation map will be ordered like this: forest loss, forest concessions, protected areas, forest height. Layers are displayed according to their visual hierarchy. The higher the layer in the list, the higher its visual priority in the stack of layers that have been added to the map</p> <p>Within the Map CT, there is a searchable interface for finding and selecting the layers you want to add to your map. These layers were named during the first step of this tutorial. When you select multiple layers, their display order is from top to bottom.</p> <p><a href="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM.png"><img alt="Map CT Layer Selector" class="size-medium wp-image-1573 aligncenter" decoding="async" height="300" loading="lazy" sizes="auto, (max-width: 300px) 100vw, 300px" src="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM-300x300.png" srcset="https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM-300x300.png 300w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM-150x150.png 150w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM-1021x1024.png 1021w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM-260x260.png 260w, https://geojournalism.org/wp-content/uploads/2015/02/Screen-Shot-2016-03-16-at-3.17.28-PM.png 1458w" width="300"/></a></p> <p>Once you have selected the layers you want to appear in your map, you the select options that control how your audience can interact with your selected layers. The layers can be:</p> <ul> <li>Fixed – use this if you don’t want to allow the viewer to turn off the layer.</li> <li>Switchable – when you want that the viewer to be able to switch the layer on and off.</li> <li>Swapable – when you would like to permit a choice between a set of layers.</li> </ul> <p>You can review the map design before publishing by clicking on the “UPDATE PREVIEW” button.</p> <h1 class="summary-item" id="defining-the-center-point-scale-and-scope-of-the-map"><a href="#defining-the-center-point-scale-and-scope-of-the-map">Defining the Center Point, Scale and Scope of the Map</a></h1> <p>The last step before publishing the map is the “Map Configurations” section. This is located under the preview map window. Here you can set some limits on the where a user can move to within the map (most maps are not global and should be define). There are three ways to hone in on the interaction.</p> <ul> <li>The center and initial zoom: This is the default view for the map when the page loads.</li> <li>The minimum and maximum zoom: This feature allows you to limit the zoom level to a specific range. Sometime data is now very useful at a high zoom level because it is generalized for a regional map. Other times, the scope of data may only cover a single city. If either of these is the case, limiting the zoom levels will help the map load faster.</li> <li>The limits for navigation of the map: Similar to zoom limits, if the map is not global in scale then it is important to put limits on “panning.” Panning is the action of moving the map from side (2-dimensions) to side rather than zooming in and out (3-dimensions).</li> </ul> <p><a href="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-04-%C3%A0s-09.38.35.png"><img alt="Captura de Tela 2015-02-04 às 09.38.35" class="alignnone size-full wp-image-1347" decoding="async" height="536" loading="lazy" src="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-04-%C3%A0s-09.38.35.png" width="922"/></a></p> <p>To create these configurations, you can navigate the map and when you are in the position that you desire, click the buttons “Define current as center and zoom” and “Define current as navigation limits”.</p> <p>Using the other setting, it is possible to:</p> <ul> <li>Turn off the possibility of using the mouse or touchpad to change the zoom</li> <li>Turn on a filter, permitting that the visitors choose the start and end date of the posts which they wish to see</li> <li>Turn on a search field on the map</li> </ul> <div class="author-shortcodes"> <div class="author-inner"> <div class="author-image"> <img alt="" src="https://photos1.meetupstatic.com/photos/member/2/7/7/f/member_18490111.jpeg"/> <div class="author-overlay"></div> </div> <!-- .author-image --> <div class="author-info"> <strong>Willie Shubert</strong> is the Senior Project Coordinator for Internews’ Earth Journalism Network. As a coordinator of a global network of environmental journalists, Willie helps make tools that enable people to connect with each other, find material support, and amplify their local stories to global audiences. In his previous position at National Geographic Magazine, he coordinated translation for the magazine’s 32 local language partners. He holds a degree in Geography from Humboldt State University with concentrations in cartography, environmental economics, and Chinese Studies. Outside of work, he devotes his time to the development of a free school dedicated to community building through education and to collaborative mapping and audio projects. </div> <!-- .author-info --> </div> <!-- .author-inner --> </div> .author-shortcodes <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/> <p>The post <a href="https://geojournalism.org/2015/02/making-maps-with-jeo/">Making Maps with JEO</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> 1335 https://geojournalism.org/2015/02/using-jeos-content-type/ Willie Shubert Tue, 03 Feb 2015 16:04:13 +0000 Apps Maps https://dev.geojournalism.org/?p=1292 <p>Understanding the unique WordPress Content Types created for JEO is a great way to understand how to organize and create content. These content types are defined by the type of information they contain and how they are used throughout a JEO site. There are two main categories of content types used in JEO; one group [&#8230;]</p> <p>The post <a href="https://geojournalism.org/2015/02/using-jeos-content-type/">Using JEO’s Content Type</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> <p>Understanding the unique WordPress Content Types created for JEO is a great way to understand how to organize and create content. These content types are defined by the type of information they contain and how they are used throughout a JEO site.</p> <p>There are two main categories of content types used in JEO; one group is used to organize the data and visualizations and the other group if for creating stories and landing pages.</p> <h1 class="summary-item" id="data-visualization-content-types"><a href="#data-visualization-content-types">Data Visualization Content Types</a></h1> <div class="wp-caption aligncenter" id="attachment_1316" style="width: 570px"><img alt="Dataset page JEO" aria-describedby="caption-attachment-1316" class="wp-image-1316" decoding="async" height="351" loading="lazy" src="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-02-%C3%A0s-16.32.25.png" width="560"/><p class="wp-caption-text" id="caption-attachment-1316">The dataset page on the geojournalism site InfoAmazonia. All the sources, files to download and descriptions are directly edited at the JEO WordPress theme</p></div> <p><em>Layer</em></p> <p>JEO’s layer content type provides the space to add a spatial data source into the JEO database for use in dataset pages and stacked to make maps. It is important to note that JEO does not have the ability to host <a href="https://www.mapbox.com/guides/how-web-maps-work/" target="_blank">map tiles</a> but rather links to external tile servers using APIs, open source standards such as WMS and the javascript library leaflet.js (through the services of <a href="https://www.mapbox.com/" target="_blank">MapBox</a> and <a href="https://cartodb.com/" target="_blank">CartoDB</a>)</p> <p>On the layer content type you define the topical categories, create a layer legend, and link to dataset pages.</p> <p><em>Map </em></p> <p><a href="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-03-%C3%A0s-07.27.32.png"><img alt="Maps JEO" class="aligncenter size-full wp-image-1323" decoding="async" height="314" loading="lazy" src="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-03-%C3%A0s-07.27.32.png" width="755"/></a></p> <p>JEO’s maps are created by stacking one or more custom thematic layers on top of a basemap. The Maps Content Type is there location where layers are named and organized. This is done by configuring the “Maps Setup” section of the form.</p> <p>The basic component of a map is its layers—an individually designed dataset—that are combined together to tell a story. These layers are organized and configured by adding layer content as previously described.</p> <p>For more information on how to use the maps content type see the detailed tutorial: Making Maps with JEO:</p> <p><em>Map Group</em></p> <p>This content type bundles published maps content into the tabbed user-interface typical of the homepage or news section of a GeoJournalism site. This feature is useful for site that have many maps and want to provide the opportunity to create a narrative series of maps or a selection different topics.</p> <p>For more information on how to use the map groups content type see also JEO, First Steps</p> <h1 class="summary-item" id="narrative-content-types"><a href="#narrative-content-types">Narrative Content Types</a></h1> <p><em>Post (Story)</em><br/> The post content type is the section most familiar to regular users of a content management system (CMS). This is the section where you can add news items and geolocate them using JEO’s mapping tools.</p> <p>When adding a new story to a JEO site it is important to add information about the publisher, the story category, the map(s) it should be displayed on, and its location. This metadata is quite important for maintaining the search features of the websites and the ability to syndicate stories using JEO’s Stories API.</p> <p>There are a number of content editing and formatting details that are covered in the following tutorial: <strong><a href="https://geojournalism.org/2014/06/portugues-jeo-primeiros-passos/">Jeo: First Steps</a></strong></p> <p><em>Markers Icons</em><br/> Stories appear on JEO maps as point icons that can be interacted with upon rollover for pop-ups or as links to the full story. If you have many unique categories on posts it is possible to create custom icons to differentiate between post types.</p> <p><a href="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-03-%C3%A0s-07.43.12.png"><img alt="Captura de Tela 2015-02-03 às 07.43.12" class="aligncenter size-full wp-image-1325" decoding="async" height="488" loading="lazy" src="https://geojournalism.org/wp-content/uploads/2015/02/Captura-de-Tela-2015-02-03-%C3%A0s-07.43.12.png" width="814"/></a></p> <p><em>Pages</em><br/> The pages content type creates long-term content such as landing pages or thematic issue briefings that don’t change often but are important. In contrast with the posts content type, pages lack many of the modals (fields) for adding metadata.</p> <div class="author-shortcodes"> <div class="author-inner"> <div class="author-image"> <img alt="" src="https://photos1.meetupstatic.com/photos/member/2/7/7/f/member_18490111.jpeg"/> <div class="author-overlay"></div> </div> <!-- .author-image --> <div class="author-info"> <strong>Willie Shubert</strong> is the Senior Project Coordinator for Internews’ Earth Journalism Network. As a coordinator of a global network of environmental journalists, Willie helps make tools that enable people to connect with each other, find material support, and amplify their local stories to global audiences. In his previous position at National Geographic Magazine, he coordinated translation for the magazine’s 32 local language partners. He holds a degree in Geography from Humboldt State University with concentrations in cartography, environmental economics, and Chinese Studies. Outside of work, he devotes his time to the development of a free school dedicated to community building through education and to collaborative mapping and audio projects. </div> <!-- .author-info --> </div> <!-- .author-inner --> </div> .author-shortcodes <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/> <p>The post <a href="https://geojournalism.org/2015/02/using-jeos-content-type/">Using JEO’s Content Type</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> 1292 https://geojournalism.org/2014/06/portugues-jeo-primeiros-passos/ pixel Tue, 03 Jun 2014 23:29:08 +0000 Apps Maps jeo wordpress https://geojournalism.oeco.org.br/?p=931 <p>Introduction Jeo is a WordPress theme that acts as an online platform for geojournalism and allows publication of news articles as layers of information on digital maps. With Jeo, creating interaction between the layers of data and contextual information is much more intuitive. The theme is developed to be a base of &#160;child themes&#160;and is [&#8230;]</p> <p>The post <a href="https://geojournalism.org/2014/06/portugues-jeo-primeiros-passos/">JEO: first steps</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> <h1 class="summary-item" id="introduction"><a href="#introduction">Introduction</a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Jeo is a WordPress theme that acts as an online platform for geojournalism and allows publication of news articles as layers of information on digital maps. With Jeo, creating interaction between the layers of data and contextual information is much more intuitive. The theme is developed to be a base of  <i>child themes</i> and is ready for multilingual content and facilitates publication tasks. </span></span></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">In this tutorial we will cover the installation of the theme, the publication of a map, the publication of a post, and configurations for Jeo. </span></span></p> <h1 class="summary-item" id="history"><a href="#history">History</a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The  </span></span><a href="https://infoamazonia.org/" target="_blank">InfoAmazonia</a><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">  project was created in 2012, with the objective of aggregating data and news about the Amazon rainforest. Initially, updating the site was complex. With the goal of planning the development of the site, </span></span><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">we carried out a study which at the end of the year concluded that the best alternative in the long term to substitute the software was to develop a theme for WordPress. After the theme was developed and the new site was launched, we decided to generalize the theme to facilitate the use of other people to create their own sites with maps. </span></span></p> <h1 class="summary-item" id="instalation"><a href="#instalation">Instalation </a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">You need to have WordPress installed on your server. Next we will show you two ways to install Jeo. </span></span></p><div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Step 1 </a></li> <li><a href="#"> Step 2 </a></li> <li><a href="#"> Step 3 </a></li> </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> <a href="https://github.com/oeco/jeo">Download</a><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> Jeo on GitHub by clicking on “Download ZIP” on the right sidebar. If you know how to use git, see instructions </span></span><a href="https://oeco.github.io/jeo/">here</a><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">. </span></span><p></p> <p><img alt="jeo-inst-1github" decoding="async" src="https://geojournalism.org/wp-content/uploads/2014/02/jeo-inst-1github-1024x575.png"/></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> In Appearence &gt; Themes, go to the tap “Install Themes” and choose “Upload”.<p></p> <p><img alt="jeo-inst-2upload" decoding="async" src="https://geojournalism.org/wp-content/uploads/2014/02/jeo-inst-2upload-1024x575.png"/></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Upload the file you just downloaded and activate the theme.<p></p> <p><img alt="jeo-inst-3ativate" decoding="async" src="https://geojournalism.org/wp-content/uploads/2014/02/jeo-inst-3ativate-1024x575.png"/></p> </div> </div> </div> </div> .et-tabs-container <p></p> <h1 class="summary-item" id="publishing-a-map"><a href="#publishing-a-map">Publishing a Map</a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p><div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Step 1 </a></li> <li><a href="#"> Step 2 </a></li> <li><a href="#"> Step 3 </a></li>  <li><a href="#"> Step 4 </a></li>  <li><a href="#"> Step 5 </a></li>  </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> Vá em “Maps &gt; Add new map”.<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot1.png"><img alt="screenshot1" class="alignnone size-large wp-image-1056" decoding="async" height="522" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot1-1024x522.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot1-1024x522.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot1-300x153.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot1.png 1286w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Define a name and description for your map.<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot21.png"><img alt="screenshot2" class="alignnone size-large wp-image-1054" decoding="async" height="524" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot21-1024x524.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot21-1024x524.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot21-300x153.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot21.png 1288w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> <span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The section “Map Settings” is divided into 2 parts.</span></span><p></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">In the first area you can define the server which will provide the </span></span><em><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">base layer</span></span></em><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> in a drop-down list. Once you choose a server, the URL address under the list will be altered to </span></span><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">the server’s </span></span><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">default. </span></span><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The base layer is the layer which remains under all of the others, and can be chosen from OpenStreetMap, Mapquest OpenStreetMap, Mapquest Satellite, Stamen Toner, Stamen Watercolour, Stamen Terrain, Other (used for when you have your own tilelayer URL), or None (in case you don’t want to use a base layer, or want to use one from MapBox or CartoDB).</span></span></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">To add layers, you can use the “Add MapBox layer” and “Add CartoDB layer” buttons if you want to use layers from these servers. Otherwise, use “Add tile layer”. </span></span></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Inside the box that is created you’ll see 3 options:es:</span></span></p> <ul> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Title, which is the name of your layer. It will always be used when you need to refer to this layer (in a menu, for example).</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">ID or URL. This is where you should put the URL of the layer, or, in the case of a MapBox layer, your ID.</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Layer options. The layers can be:</span></span> <ul> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Fixa – </span></span><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">use this if you don’t want to allow the viewer to turn off the layer.</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Switchable – when you want that the viewer to be able to switch the layer on and off.</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Swapable – when you would like to permit a choice between a set of layers.</span></span></li> </ul> </li> </ul> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The order of superposition of the layers is from bottom to top, in other words, the higher the layer on the administration screen, the higher its priority over the the others. It will be displayed on top of the layers below it on the list.</span></span></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot3.png"><img alt="screenshot3" class="alignnone size-large wp-image-1055" decoding="async" height="520" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot3-1024x520.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot3-1024x520.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot3-300x152.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot3.png 1292w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Remaining in the “Map Configurations”, in the lower area of the map, you can define:<p></p> <ul> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The center and initial zoom.</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The minimum and máximum zoom.</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The limits for navegation of the map.</span></span></li> </ul> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">If you want, you can nevegate the map and, when you are in the position that you desire, click the buttons “Define current as center and zoom” and “Define current as navegation limits”.</span></span></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">On the lower part, it is possible to: </span></span></p> <ul> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Turn off the possibility of using the mouse or touchpad to change the zoom</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Turn on a filter, permitting that the visitors choose the start and end date of the posts which they wish to see </span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Turn on a search field on the map</span></span></li> </ul> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot4.png"><img alt="screenshot4" class="alignnone size-large wp-image-1057" decoding="async" height="521" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot4-1024x521.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot4-1024x521.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot4-300x152.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot4.png 1291w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Now publish!<p></p> <p><img alt="jeo-mapa-4publicado" decoding="async" src="https://geojournalism.org/wp-content/uploads/2014/02/jeo-mapa-4publicado-1024x575.png"/></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> </div> </div> </div> .et-tabs-container <p></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Since its the first map you have criated, it automatically goes to the home page of the site. For this all the future maps you publish, a page is automatically created for the individual map.</span></span></p> <h1 class="summary-item" id="publishing-a-post"><a href="#publishing-a-post">Publishing a post</a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p><div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Step 1 </a></li> <li><a href="#"> Step 2 </a></li> <li><a href="#"> Step 3 </a></li> <li><a href="#"> Step 4 </a></li> <li><a href="#"> Step 5 </a></li> </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> Go to “Post” &gt; “Add new”.<p></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot5.png"><img alt="screenshot5" class="alignnone size-large wp-image-1058" decoding="async" height="527" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot5-1024x527.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot5-1024x527.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot5-300x154.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot5.png 1288w" width="1024"/></a></span></span></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Write your title and add content.<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot6.png"><img alt="screenshot6" class="alignnone size-large wp-image-1059" decoding="async" height="525" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot6-1024x525.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot6-1024x525.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot6-300x153.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot6.png 1289w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Define the coordinates.<p></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Observe that there is a search box. In example below, you can see a search for “Bangalore”.</span></span></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot7.png"><img alt="screenshot7" class="alignnone size-large wp-image-1060" decoding="async" height="527" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot7-1024x527.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot7-1024x527.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot7-300x154.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot7.png 1286w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Determine the maps on which the post will appear.<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot8.png"><img alt="screenshot8" class="alignnone size-large wp-image-1061" decoding="async" height="528" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot8-1024x528.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot8-1024x528.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot8-300x154.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot8.png 1274w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> Now Publish your post!<p></p> <p><img alt="jeo-post-5publicado" decoding="async" src="https://geojournalism.org/wp-content/uploads/2014/02/jeo-post-5publicado-1024x575.png"/></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> </div> </div> </div> .et-tabs-container <p></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Verify is you can see the post on the map. It may be necessary to click on “Clear GeojSON Cahce” on the toolbar. </span></span></p> <h1 class="summary-item" id="setting-up-the-site"><a href="#setting-up-the-site">Setting up the site</a></h1> <ol> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Go to “Appearance &gt; Jeo Settings”</span></span></li> <li><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">The Settings should be self-explanatory. If you don’t understand one of the settings,  <a href="https://github.com/oeco/jeo/issues">write to us</a> (click on “New Issue”)!</span></span></li> </ol> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p><div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Step 1 </a></li> <li><a href="#"> Step 2 </a></li> </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> Go to “Appearence &gt; Jeo Settings”.<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot9.png"><img alt="screenshot9" class="alignnone size-large wp-image-1062" decoding="async" height="526" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot9-1024x526.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot9-1024x526.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot9-300x154.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot9.png 1279w" width="1024"/></a></p> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;"> </span></span></p></div> <div class="et_slidecontent"> The Settings should be self-explanatory. If you don’t understand one of the settings,  <a href="https://github.com/oeco/jeo/issues">write to us</a> (click on “New Issue”)!<p></p> <p><a href="https://geojournalism.org/wp-content/uploads/2014/02/screenshot10.png"><img alt="screenshot10" class="alignnone size-large wp-image-1063" decoding="async" height="512" loading="lazy" sizes="auto, (max-width: 1024px) 100vw, 1024px" src="https://geojournalism.org/wp-content/uploads/2014/02/screenshot10-1024x512.png" srcset="https://geojournalism.org/wp-content/uploads/2014/02/screenshot10-1024x512.png 1024w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot10-300x150.png 300w, https://geojournalism.org/wp-content/uploads/2014/02/screenshot10.png 1292w" width="1024"/></a></p> </div> </div> </div> </div> .et-tabs-container <p></p> <h1 class="summary-item" id="next-steps"><a href="#next-steps">Next Steps</a></h1> <p><span style="color: #333333;"><span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;">Congratulations, you have your first site with Jeo! Now it is time to <a href="https://github.com/oeco/jeo">go to GitHub</a> and copy the code to create your own child theme.</span></span></p> <div class="author-shortcodes"> <div class="author-inner"> <div class="author-image"> <img alt="" src="https://geojournalism.org/wp-content/uploads/2014/06/pixelpic.jpg"/> <div class="author-overlay"></div> </div> <!-- .author-image --> <div class="author-info"> pixel started his VJ career in 2002. He’s director of memeLab and founding member of Garoa Hacker Clube. In addition to audiovisual performances, develops multimedia works that question the relationship between people and digital technologies, by the use of open technologies and / or pervasive where the people assumes the role of author. He made performances in over 15 states and 4 other countries. Among his recent projects are the research Criaturas Afetivas that uses mathematical models for understanding love, and Jandig where artists, developers, curators and audience mix their roles in creating TAZes in augmented reality. </div> <!-- .author-info --> </div> <!-- .author-inner --> </div> .author-shortcodes <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/> <p>The post <a href="https://geojournalism.org/2014/06/portugues-jeo-primeiros-passos/">JEO: first steps</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> 931 https://geojournalism.org/2014/02/easy-steps-for-making-charts-and-infographics-using-the-free-datawrapper-app/ Oluseun Onigbinde Thu, 13 Feb 2014 18:29:25 +0000 Apps Data Visualization https://geojournalism.oeco.org.br/?p=968 <p>Leading media organizations are using Datawrapper, a simple and free tool, to improve their storytelling this way. Datawrapper is an interactive chart app that can be embedded into stories such as this one, which shows the Nigerian government&#8217;s proposed budget in 10 charts. To sustain user attention and drive audience engagement, journalists and news organizations [&#8230;]</p> <p>The post <a href="https://geojournalism.org/2014/02/easy-steps-for-making-charts-and-infographics-using-the-free-datawrapper-app/">Easy steps for making charts and infographics using DataWrapper</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> <p>Leading media organizations are using <a href="https://datawrapper.de" target="_blank">Datawrapper</a>, a simple and free tool, to improve their storytelling this way. Datawrapper is an interactive chart app that can be embedded into stories such as <a href="https://www.yourbudgit.com/blog/view/8" target="_blank">this one</a>, which shows the Nigerian government’s proposed budget in 10 charts.</p> <p><span id="more-968"></span></p> <p>To sustain user attention and drive audience engagement, journalists and news organizations should learn to use data visualizations.</p> <p>Data visualizations let you explain a set of data simply with an infographic, an interactive application or a chart. With multiple stories competing for users’ attention on the boundless Internet, data visualizations are a creative way to interest users in your content and add context or a different perspective to your story.<a href="https://geojournalism.org/wp-content/uploads/2014/02/dsc_4391.jpg"><img alt="dsc_4391" class="size-full wp-image-994 alignright" decoding="async" height="200" loading="lazy" src="https://geojournalism.org/wp-content/uploads/2014/02/dsc_4391.jpg" width="300"/></a></p> <p>As an <a href="https://www.icfj.org/about/profiles/oluseun-onigbinde" target="_blank">ICFJ Knight International Journalism Fellow</a> in Nigeria, I work on using digital methods to support journalists in improving their storytelling and driving a wider engagement. Our team of fellows and our local <a href="https://groups.google.com/forum/?hl=en#%21forum/hackshackers-lagos" target="_blank">HacksHackers chapter</a>) in Lagos recently organized a data journalism class focused on how to use the <a href="https://datawrapper.de/" target="_blank">Datawrapper</a> application to strengthen storytelling.</p> <p>Our class participants had never used DataWrapper, but it’s so simple to use that they have already returned to their newsrooms and created these visualizations:</p> <p>—<a href="https://sustainableconvos.com/infographics-population-and-economic-growth/" target="_blank">Infographics on population and economic growth</a></p> <p>—<a href="https://www.yarnmesomething.com/2014/01/marketing-gadgets-to-women.html" target="_blank">Marketing gadgets to women</a></p> <p>—<a href="https://www.tech360ng.com/activities-social-media-driving-force-data-demand/" target="_blank">Social media is a driving force for data demand</a></p> <h2 class="summary-item" id="get-started-with-using-datawrapper"><a href="#get-started-with-using-datawrapper">Get started with using DataWrapper</a></h2> <p> </p><div class="et-tabs-container et_sliderfx_fade et_sliderauto_false et_sliderauto_speed_5000 et_slidertype_top_tabs"> <ul class="et-tabs-control"> <li><a href="#"> Step 1 </a></li> <li><a href="#"> Step 2 </a></li> <li><a href="#"> Step 3 </a></li> <li><a href="#"> Step 4 </a></li> <li><a href="#"> Step 5 </a></li> <li><a href="#"> Step 6 </a></li> </ul> <!-- .et-tabs-control --> <div class="et-tabs-content"> <div class="et-tabs-content-wrapper"> <div class="et_slidecontent"> <ol> <li>Find a data setYou’ll need a set of data in spreadsheet format. In this example, I’m using a data set obtained from Nigeria’s <a href="https://budgetoffice.gov.ng" target="_blank">Budget Office of the Federation</a>. If you don’t have your own spreadsheet handy, use the same one I did so you can try out Datawrapper and understand the power of the tool. The budget spreadsheet is available for free here as a <a href="https://docs.google.com/spreadsheet/ccc?key=0Aj_5npSmNt1IdHRlOHIxWElRRjlySU1jYkc5QnAydEE&amp;usp=sharing" target="_blank">Google Doc</a>. </li></ol></div> <div class="et_slidecontent"> <ol>2. Log in to the Datawrapper site through an email address or Twitter password.</ol> <div><img alt="image: " class="aligncenter" decoding="async" height="241" loading="lazy" src="https://ijnet.org/sites/default/files/styles/news_large/public/data1.png?itok=H_Y9s89A" title="image: " width="420"/></div> </div> <div class="et_slidecontent"> <ol>3. Copy and paste data from a Microsoft Excel spreadsheet or upload a CSV spreadsheet document.</ol> <div><img alt="image: " class="aligncenter" decoding="async" height="192" loading="lazy" src="https://ijnet.org/sites/default/files/styles/news_large/public/data3.png?itok=yYlCbqXb" title="image: " width="420"/></div> <div></div> </div> <div class="et_slidecontent"> <ol>4. The DataWrapper application translates the data into a table and displays that for you. You can add data sources and also links if you have them. If the table looks ok to you, click the “Visualize” button.</ol> <div><img alt="image: " class="aligncenter" decoding="async" height="184" loading="lazy" src="https://ijnet.org/sites/default/files/styles/news_large/public/data4.png?itok=o0WElFyq" title="image: " width="420"/></div> </div> <div class="et_slidecontent"> <ol>5. Next, you’ll see the “Visualize” tab, which shows an array of chart types that you can use.</ol> <div><img alt="image: " class="aligncenter" decoding="async" height="254" loading="lazy" src="https://ijnet.org/sites/default/files/styles/news_large/public/data5.png?itok=T7P6ig4X" title="image: " width="420"/></div> <p>Do you need help figuring out which kind of chart to use? Check out this <a href="https://extremepresentation.typepad.com/blog/files/choosing_a_good_chart.pdf" target="_blank">guide</a>.</p> <p>Mini-tabs can help in refining the chart. They let you add titles and descriptions, as well as change the layouts.</p> </div> <div class="et_slidecontent"> <ol>6. You can copy and paste the embed code and publish the chart. (If you need to correct the chart later, you’ll need to republish the chart to get a new embed code.)</ol> <div><img alt="image: " decoding="async" height="231" loading="lazy" src="https://ijnet.org/sites/default/files/styles/news_large/public/data6.png?itok=Da6WjJ7a" title="image: " width="420"/></div> <div></div> <div> </div> </div> </div> </div> <!-- .et-tabs-container --></div> <p>I hope you’ll try out DataWrapper and publish your visualizations on your news site or your own blog.</p> <div class="author-shortcodes"> <div class="author-inner"> <div class="author-image"> <img alt="" src="https://pbs.twimg.com/profile_images/420474130799284224/k_pzRQfA.jpeg"/> <div class="author-overlay"></div> </div> <!-- .author-image --> <div class="author-info"> <em><a href="https://twitter.com/seunonigbinde" target="_blank">Oluseun Onigbinde</a> is a digital innovator and open data advocate. As part of his <a href="https://www.icfj.org/our-work/nigeria-increasing-citizen-engagement-health-news" target="_blank">ICFJ Knight International Journalism Fellowship</a> in Nigeria, he promotes the use of creative digital tools in media organizations to increase public engagement around key development issues such as health and education.</em> </div> <!-- .author-info --> </div> <!-- .author-inner --> </div> .author-shortcodes <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/> <p>The post <a href="https://geojournalism.org/2014/02/easy-steps-for-making-charts-and-infographics-using-the-free-datawrapper-app/">Easy steps for making charts and infographics using DataWrapper</a> appeared first on <a href="https://geojournalism.org">geojournalism.org</a>.</p> 968