website/visualization.html at master · interra/website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
---
layout: page
title: Interra | Open Data Experts
permalink: /visualization/
---

<h2>Interra Visualization</h2>

<div class="services">
    <div class="row">
      <div style="font-size: 1.3em; padding: 20px 15px 50px; font-style: italic">


  <div class="col-md-9" >
      <p style="padding-right: 20px">
            <strong>Interra Visualization</strong> transforms large datasets into interactive story-telling experiences.
        </p>
      <p style="padding-right: 20px">

Welcome to the future - data is everywhere, the digital divide recedes before our very eyes, and we stand on the brink of.... confusion? Given the power of accessible open source technologies, we think that we can do better! We've wired this demo to give just a taste of what can be done with open data and open source technologies on the web.</p>
  </div>
  <div class="col-md-3">
      <div>
      <a style="display: block; font-size: 1.2em; margin-bottom: 0px; padding: 10px" href="/#contact" class="btn btn-default">Contact Us</a> <div style="padding: 15px;
line-height: 45px;
text-align: center;">for a live demo terms or pricing</div>
    </div>
  </div>
  </div>
  </section>
</div>
<section id="portfolio" class="container text-center">
  <div class="portfolio-section">
    <div class="row" style="margin:0">
      <h3 style="padding: 40px 0 0 0">features</h3>
    </div>
    <div class="container">
        <div class="info-row"><div class="row text-left align-items-center pt-5 pb-md-5">
            <div class="col-4 col-md-3 m-md-auto order-md-5">
                <img style="width:100%; padding: 15px" alt="image" class="img-fluid indent" src="/img/viz-img-postgis.png">
            </div>
            <div class="col-12 col-md-9">
                <h4><strong>Geospatial Data</strong></h4>
                <p class="text-h3">Geospatial data is (literally) everywhere. Data is not just in rows and columns anymore: it is on streets and corners, and it follows us around everywhere we go. What does this data tell us about our lives, our cities, our societies? Let's find out!</p><p><a class="btn btn-default" href="http://postgis.net/">Learn More</a></p></div></div></div>
        <div class="info-row"><div class="row text-left align-items-center pt-5">
            <div class="col-4 col-md-3"><img alt="image" style="width:100%; padding: 15px" src="/img/viz-img-graphql.svg"></div>
            <div class="col-12 col-md-9 m-md-auto"><h4><strong>GraphQL</strong></h4><p class="text-h3">Technology is getting better - APIs are getting smarter, and the way that we can share and access data is improving. GraphQL is the latest and greatest, and makes accessing complex data into a sensible task.</p><a class="btn btn-default" href="http://graphql.org/">Learn More</a></div></div></div>
        <div class="info-row"><div class="row text-left align-items-center pt-5">
            <div class="col-4 col-md-3"><img alt="image"  style="width:100%; padding: 15px" src="/img/viz-img-react.png">
            </div>
            <div class="col-12 col-md-9 m-md-auto"><h4><strong>React</strong></h4><p class="text-h3">We utilize a suite of front-end tools to bring intuitive user experience to everyday people. Understanding data shouldn't feel like doing taxes, nor should it require a PHD. Information wants to be free and we have the tools to do it.</p><a class="btn btn-default" href="https://reactjs.org/">Learn More</a></div></div></div>
            </div>
  </div>
    <div class="row">
      <h3 style="padding-top: 90px">Demo</h3>
      <h4>Philly Open 311</h4>
      <p>Open standards are on the rise. Cities, organizations, and governments are quickly adopting them as they realize that it allows them to leverage powerful existing tools. Philly's Open311 project, utilizing the Open 311 standard, is just an example.</p>
       <div class="col-md-5 margin-b-30">
         <div class="feature-img-holder">
           <img style="padding: 5px 15px 10px 15px;" src="/img/screen-viz.png" alt="" class="img-responsive">
         </div>
       </div>
       <div class="col-md-7 margin-b-30">
           <p style="text-align: left; padding-top: 50px"><a href="http://311-demo.interra.io/?service_name=Graffiti%20Removal">View a Philly Open 311 demo</a>.</p>
       </div>
    </div>
</section>
      <p></p>