CMPS165_Final_Project/index.html at master · rubui/CMPS165_Final_Project · 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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>CMPS165 Final Project Proposal</title>
    <link href="style.css" rel="stylesheet" />
</head>

<body>
    <div id="main">
        <div id="info">
            <h1>CMPS 165 Final Project Proposal</h1>
            <h2> California House Plant Care Guide</h2>
            <h3>Goal</h3>
            <p>We wish to create a visualization for various types of plants that are commercially available in the USA. We will focus on basic care such as amount of water needed and amounts of sunlight required. Our goal is for this guide to serve as a quick and easily navigable reference for plant maintence. In doing so, the visualization can also serve as a simple buyer's guide, by showing various plants and their needs to jugde agaisnt your own lifestyle choices. We also plan to include more variables to examine such as tempurature tolerance, humidity, plant types, and ph levels of soil.
            </p>
            <h3>Definite Variables</h3>
            <ul>
                <li> Plant Habit</li>
                <li> Water Use</li>
                <li> Sun/Shade Requirements</li>
                <li> Plant Habit</li>
                <li> Pet Safe</li>
                <li> Toxicity</li>
                <li> Size at Maturity</li>
                <li> Bloom Period</li>
            </ul>
            <h3>Additional Variables</h3>
            <ul>
                <li>Temperature Requirements (Max Cold/Hot)</li>
                <li>PH Soil Preferences</li>
                <li>Life Span</li>
                <li>Invasiveness</li>
            </ul>

            <h3>Data Sets</h3>
            <ol>
                <li><a href="https://plants.usda.gov/adv_search.html">USDA PLANTS Dataset</a></li>
                <li><a href="https://www.try-db.org/">TRY Plant Trait Database</a></li>
                <li><a href="https://www.gbif.org/">Global Biodiversity Information Facility</a></li>
            </ol>
            <h3>Potential Data Sets</h3>
            <p>There exists a number of encyclopedia's on the subject and so, they may serve as useful sources to supplement any missing information from databases or to simplify certain aspects of the data if needed. Such communities can also help us narrow down choices in plants to include in the visualization.</p>
            <ol>
                <li><a href="http://ucanr.edu/sites/WUCOLS/Plant_Search/">WUCOLS PLant Database</a></li>
                <li><a href="https://davesgarden.com/guides/pf/">Dave's Garden Plant Database</a></li>
                <li><a href="http://www.guide-to-houseplants.com/">Guide to Houseplant's Encyclopedia</a></li>
                <li><a href="https://garden.org/">National Gardening Database</a></li>
            </ol>
            <h3>Relevant Visualization Sources</h3>
            <p> There does not exist a visulization that we could find for the topic, so what we have instead are static charts and inspiration for the visual layout of the project </p>
            <ol>
                <li>University of Illinois Extension's <a href="https://img.buzzfeed.com/buzzfeed-static/static/2015-03/19/12/enhanced/webdr13/enhanced-1008-1426782359-1.jpg?downsize=715:*&output-format=auto&output-quality=auto"> House Plant Watering Chart</a></li>
                <li>Billing Brigde Animal Hosptial, April 25, 2017 <a href="https://www.facebook.com/billingsbridgeanimalhospital.ca/photos/a.1304334719661147.1073741831.1037401169687838/1331653430262609/?type=3&theater"> Pet Friendly House Plant Guide</a></li>
                <li>CMPS165 Final Projects Winter 2015 <a href="https://sureshlodha.github.io/CMPS165_Winter15_FinalProjects/PopularDrugs/">Popular Drugs</a></li>
                <li>New York Times's, February 12, 2012 <a href="https://archive.nytimes.com/www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html">Four Ways to Slice Obama's 2013 Budget Proposal</a></li>
                <li>CMPS263, Winter 2018<a href="https://hannabrahman.github.io/Data-Visualization"> Influential Women in History</a></li>
            </ol>

            <h3>Sketch of Proposed Visualization</h3>
            <img src="sketch_graph.png" width="1000px">


            <h3>Contact Information</h3>
            <ol>
                <li>Name: Rebecca Bui, Melanie Lum, Conor Rogers, Rishita Roy </li>
                <li>Email: rubui@ucsc.edu, mhlum@ucsc.edu, cojaroge@ucsc.edu, riroy@ucsc.edu </li>
                <li> <a href="https://github.com/rubui/CMPS165_Final_Project">Github Link</a></li>

            </ol>

            <a href="graph.html">
                <h3>
                    Link to graph
                </h3>
            </a>
        </div>
        <div id="display"></div>

    </div>

    <!-- place .js src here   -->
    <!--
    <script src="//d3js.org/d3.v4.min.js"></script>
    <script src="directed_graph.js"></script>
    <script type="text/javascript">
        //global vars go here:
        //...
        //color will obviously be hardcoded for habits (probably)
        var color = d3.scaleOrdinal(d3.schemeCategory20);

        //loading that csv
        d3.csv("plants_clean_38.csv", function(error, d){
            var data = d;
            console.log(d);

            var svg = d3.select("#display")
            .append("svg")
            .attr("class", "force-scale")
            .attr("width",940)
            .attr("height",600);

            //run functions here
            directed_graph(data, svg);

        });


    </script>
-->
</body>
</html>