diff --git a/seattle/seattle/models.py b/seattle/seattle/models.py index fe02494..edc15ec 100644 --- a/seattle/seattle/models.py +++ b/seattle/seattle/models.py @@ -26,11 +26,14 @@ class Neighborhoods_Model(Base): @classmethod def neighborhood(cls, lat, lon): """Output neighborhood that contains lat lon.""" - return (DBSession.query(cls) - .filter(func.ST_Within(func.ST_SetSRID(func - .ST_MakePoint(lon, lat), 4236), func - .ST_SetSRID(cls.geom, 4236))).one().name - ) + try: + return (DBSession.query(cls) + .filter(func.ST_Within(func.ST_SetSRID(func + .ST_MakePoint(lon, lat), 4236), func + .ST_SetSRID(cls.geom, 4236))).one().name + ) + except: + return u'----' class Incidents_Model(Base): diff --git a/seattle/seattle/static/css/index.css b/seattle/seattle/static/css/index.css index bfc7eda..fa184fb 100644 --- a/seattle/seattle/static/css/index.css +++ b/seattle/seattle/static/css/index.css @@ -1260,9 +1260,14 @@ tr { shape-rendering: crispEdges; } -.x.axis path { +.y.axis path, +.y.axis line { display: none; } +.x.axis path, +.x.axis line { + /* display: none; */ +} .line { fill: none; @@ -1276,11 +1281,6 @@ tr { stroke: 0px; } -.map-container { - position: fixed; - height: 100%; - width: 38%; -} #map { position: absolute; @@ -1296,18 +1296,11 @@ tr { z-index: 100; } -.content { - position: relative; - margin-left: 38%; - padding-left: 2rem; -} - .title { font-family: 'ff-prater-script-web'; font-size: 3em; position: relative; bottom: 10px; - color: red; padding-left: 10px; } @@ -1326,6 +1319,10 @@ h2 { border-radius: 2px; } +.b-y { border-bottom: 4px solid #e09200;} +.b-o { border-bottom: 4px solid #ffbe1a;} +.b-r { border-bottom: 4px solid #fde668;} + /* Creates a small triangle extender for the tooltip */ .d3-tip:after { box-sizing: border-box; @@ -1350,21 +1347,64 @@ h2 { color: #ff0000; } -.neg { - color: green; +svg { + max-width: 100%; +} + +footer ul { padding-left: 0;} +footer li { + display: inline; + word-spacing: 5px; +} + +.button { + font-weight: bold; + border: 2px solid #eee; + padding: 3px 10px; + background: #f6f6f6; } -.fc { - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-flex-wrap: nowrap; - -ms-flex-wrap: nowrap; - flex-wrap: nowrap; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; +.italic { + color: #aaa; +} + + +/* RWD (kek) */ +/* Mobile styles */ +.no-mobile { display: none; } +header { margin-top: 2rem; } +header a:hover { color: #ff0000; } +.title h1 { font-size: 2rem; } +.title img { height: 80px;} +.map-container { + position: absolute; + height: 50vh; + width: 100%; +} +.content { + position: relative; + margin-top: 50vh; + padding: 2rem; +} + +@media (min-width:45em) { + .no-desktop { display: none; } + .no-mobile { display: block; } + .title h1 { + font-size: 1rem; + } + .map-container { + position: fixed; + height: 100%; + width: 38%; + } + .content { + margin-top: 0; + position: relative; + margin-left: 38%; + padding-left: 2rem; + width: 61%; + } + } + diff --git a/seattle/seattle/static/css/index.min.css b/seattle/seattle/static/css/index.min.css index 3d1e19a..a4fd73d 100644 --- a/seattle/seattle/static/css/index.min.css +++ b/seattle/seattle/static/css/index.min.css @@ -1 +1 @@ -/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}td,th{padding:0}*,:after,:before{box-sizing:border-box}body,button{margin:0}button,input,select,textarea{font-family:inherit;font-size:100%}img{max-width:100%}svg{max-height:100%}.btn,.btn:link,.btn:visited{border-radius:.3em;border-style:solid;border-width:1px;color:#111;display:inline-block;letter-spacing:.15em;text-decoration:none;text-transform:uppercase;transition:color .4s,background-color .4s,border .4s}.btn:hover{color:#7FDBFF;border:1px solid #7FDBFF;transition:background-color .3s,color .3s,border .3s}.btn:active{color:#0074D9;border:1px solid #0074D9;transition:background-color .3s,color .3s,border .3s}.btn--s{font-size:12px}.btn--m{font-size:14px}.btn--l{font-size:20px;border-radius:.25em!important}.btn--full,.btn--full:link{border-radius:.25em;display:block;margin-left:auto;margin-right:auto;text-align:center;width:100%}.btn--black,.btn--black:link,.btn--black:visited{color:#fff;background-color:#000}.btn--black:hover{color:#fff;border-color:#777}.btn--black:active{color:#fff;background-color:#999;border-color:#999}.btn--black:hover{background-color:#444}.btn--black{background-color:#000},.btn--gray:link,.btn--gray:visited{background-color:#f0f0f0;border-color:#f0f0f0;color:#555}.btn--gray:hover{background-color:#ddd;border-color:#ddd;color:#444}.btn--gray:active{background-color:#ccc;border-color:#ccc;color:#444},.btn--gray-border:link,.btn--gray-border:visited{background-color:#fff;border-color:#555;border-width:2px;color:#555}.btn--gray-border:hover{background-color:#fff;border-color:#ddd;color:#777}.btn--gray-border:active{background-color:#ccc;border-color:#ccc;color:#444}.btn--gray-dark:link,.btn--gray-dark:visited{background-color:#555;color:#eee}.btn--gray-dark:hover{background-color:#333;border-color:#333;color:#eee}.btn--gray-dark:active{background-color:#777;border-color:#777;color:#eee}.btn--blue:link,.btn--blue:visited{color:#fff;background-color:#0074D9}.btn--blue:hover{color:#fff!important;background-color:#0063aa;border-color:#0063aa}.btn--blue:active{color:#fff;background-color:#001F3F;border-color:#001F3F}.btn--animated{background:#f9f9f9;color:#444;border:4px solid #f1f1f1;padding:.5rem;transition:padding .4s ease-out;transition-delay:.1s}.btn--animated:hover{background:#f9f9f9;border:4px solid #f1f1f1;padding:.75rem;transition:padding .2s ease-in}@media screen and (min-width:32em){.btn--full{max-width:16em!important}}.input-text{outline:0;border:1px solid #eee}.input-invisible{outline:0;border:0}.bg-navy{background-color:#001F3F}.bg-blue{background-color:#0074D9}.bg-aqua{background-color:#7FDBFF}.bg-teal{background-color:#39CCCC}.bg-olive{background-color:#3D9970}.bg-green{background-color:#2ECC40}.bg-lime{background-color:#01FF70}.bg-yellow{background-color:#FFDC00}.bg-orange{background-color:#FF851B}.bg-red{background-color:#FF4136}.bg-fuchsia{background-color:#F012BE}.bg-purple{background-color:#B10DC9}.bg-maroon{background-color:#85144B}.bg-white{background-color:#fff}.bg-gray{background-color:#aaa}.bg-silver{background-color:#ddd}.bg-black{background-color:#111}.navy{color:#001F3F}.blue{color:#0074D9}.aqua{color:#7FDBFF}.teal{color:#39CCCC}.olive{color:#3D9970}.green{color:#2ECC40}.lime{color:#01FF70}.yellow{color:#FFDC00}.orange{color:#FF851B}.red{color:#FF4136}.fuchsia{color:#F012BE}.purple{color:#B10DC9}.maroon{color:#85144B}.white{color:#fff}.silver{color:#ddd}.gray{color:#aaa}.black{color:#111}.border--navy{border-color:#001F3F}.border--blue{border-color:#0074D9}.border--aqua{border-color:#7FDBFF}.border--teal{border-color:#39CCCC}.border--olive{border-color:#3D9970}.border--green{border-color:#2ECC40}.border--lime{border-color:#01FF70}.border--yellow{border-color:#FFDC00}.border--orange{border-color:#FF851B}.border--red{border-color:#FF4136}.border--fuchsia{border-color:#F012BE}.border--purple{border-color:#B10DC9}.border--maroon{border-color:#85144B}.border--white{border-color:#fff}.border--gray{border-color:#aaa}.border--silver{border-color:#ddd}.border--black{border-color:#111}.fill-navy{fill:#001F3F}.fill-blue{fill:#0074D9}.fill-aqua{fill:#7FDBFF}.fill-teal{fill:#39CCCC}.fill-olive{fill:#3D9970}.fill-green{fill:#2ECC40}.fill-lime{fill:#01FF70}.fill-yellow{fill:#FFDC00}.fill-orange{fill:#FF851B}.fill-red{fill:#FF4136}.fill-fuchsia{fill:#F012BE}.fill-purple{fill:#B10DC9}.fill-maroon{fill:#85144B}.fill-white{fill:#fff}.fill-gray{fill:#aaa}.fill-silver{fill:#ddd}.fill-black{fill:#111}.stroke-navy{stroke:#001F3F}.stroke-blue{stroke:#0074D9}.stroke-aqua{stroke:#7FDBFF}.stroke-teal{stroke:#39CCCC}.stroke-olive{stroke:#3D9970}.stroke-green{stroke:#2ECC40}.stroke-lime{stroke:#01FF70}.stroke-yellow{stroke:#FFDC00}.stroke-orange{stroke:#FF851B}.stroke-red{stroke:#FF4136}.stroke-fuchsia{stroke:#F012BE}.stroke-purple{stroke:#B10DC9}.stroke-maroon{stroke:#85144B}.stroke-white{stroke:#fff}.stroke-gray{stroke:#aaa}.stroke-silver{stroke:#ddd}.stroke-black{stroke:#111}.pan{padding:0}.paxs{padding:.25rem}.pas{padding:.5rem}.pam{padding:1rem}.pal{padding:2rem}.pax{padding:4rem}.pln{padding-left:0}.plxs{padding-left:.25rem}.pls{padding-left:.5rem}.plm{padding-left:1rem}.pll{padding-left:2rem}.plx{padding-left:4rem}.prn{padding-right:0}.prxs{padding-right:.25rem}.prs{padding-right:.5rem}.prm{padding-right:1rem}.prl{padding-right:2rem}.prx{padding-right:4rem}.pbn{padding-bottom:0}.pbxs{padding-bottom:.25rem}.pbs{padding-bottom:.5rem}.pbm{padding-bottom:1rem}.pbl{padding-bottom:2rem}.pbx{padding-bottom:4rem}.ptn{padding-top:0}.ptxs{padding-top:.25rem}.pts{padding-top:.5rem}.ptm{padding-top:1rem}.ptl{padding-top:2rem}.ptx{padding-top:4rem}.pvn{padding-top:0;padding-bottom:0}.pvxs{padding-top:.25rem;padding-bottom:.25rem}.pvs{padding-top:.5rem;padding-bottom:.5rem}.pvm{padding-top:1rem;padding-bottom:1rem}.pvl{padding-top:2rem;padding-bottom:2rem}.pvx{padding-top:4rem;padding-bottom:4rem}.phn{padding-left:0;padding-right:0}.phxs{padding-left:.25rem;padding-right:.25rem}.phs{padding-left:.5rem;padding-right:.5rem}.phm{padding-left:1rem;padding-right:1rem}.phl{padding-left:2rem;padding-right:2rem}.phx{padding-left:4rem;padding-right:4rem}.man{margin:0}.maxs{margin:.25rem}.mas{margin:.5rem}.mam{margin:1rem}.mal{margin:2rem}.max{margin:4rem}.mln{margin-left:0}.mlxs{margin-left:.25rem}.mls{margin-left:.5rem}.mlm{margin-left:1rem}.mll{margin-left:2rem}.mlx{margin-left:4rem}.mrn{margin-right:0}.mrxs{margin-right:.25rem}.mrs{margin-right:.5rem}.mrm{margin-right:1rem}.mrl{margin-right:2rem}.mrx{margin-right:4rem}.mbn{margin-bottom:0}.mbxs{margin-bottom:.25rem}.mbs{margin-bottom:.5rem}.mbm{margin-bottom:1rem}.mbl{margin-bottom:2rem}.mbx{margin-bottom:4rem}.mtn{margin-top:0}.mtxs{margin-top:.25rem}.mts{margin-top:.5rem}.mtm{margin-top:1rem}.mtl{margin-top:2rem}.mtx{margin-top:4rem}.mvn{margin-top:0;margin-bottom:0}.mvxs{margin-top:.25rem;margin-bottom:.25rem}.mvs{margin-top:.5rem;margin-bottom:.5rem}.mvm{margin-top:1rem;margin-bottom:1rem}.mvl{margin-top:2rem;margin-bottom:2rem}.mvx{margin-top:4rem;margin-bottom:4rem}.mhn{margin-left:0;margin-right:0}.mhs{margin-left:.5rem;margin-right:.5rem}.mhm{margin-left:1rem;margin-right:1rem}.mhl{margin-left:2rem;margin-right:2rem}.mhx{margin-left:4rem;margin-right:4rem}html{text-rendering:optimizeLegibility;-webkit-font-feature-settings:kern;-moz-font-feature-settings:kern;font-feature-settings:kern}body{font-size:1rem;font-family:fira-sans;font-weight:400;color:#444;line-height:1.5}html{font-size:15px}@media screen and (min-width:40rem){html{font-size:16px}}@media screen and (min-width:50rem){html{font-size:17px}}@media screen and (min-width:60rem){html{font-size:18px}}h1,h2,h3,h4,h5,h6{font-family:fira-sans;color:#222;font-weight:500;margin:0 0 1rem}.h1,h1{font-size:1.777778rem}.h2,h2{font-size:1.333333rem}.h3,.h4,.h5,.h6,h3,h4,h5,h6{font-size:1rem}p{font-size:1rem;max-width:40rem;margin:0 0 1rem}blockquote{font-style:italic;font-size:1rem}.light{font-weight:300}.book{font-weight:400}.medium{font-weight:500}.semibold{font-weight:600}.bold{font-weight:700}.black{font-weight:900}.uppercase{text-transform:uppercase}.italic{font-style:italic}a{color:#00e;font-weight:500;text-decoration:none;transition:.2s ease-in}a:active a:visited,a:link{color:#00e}a:hover{color:#0080ff;transition:color .2s ease-out}li{list-style-type:none}.hanging{padding-left:0}table{border-collapse:collapse;border-spacing:0;max-width:100%}th{text-align:left;font-weight:700}td,th{line-height:inherit}th{vertical-align:bottom}td{vertical-align:top}tr{border-bottom:2px solid #f4f4f4}.container{max-width:40rem}.center{margin:0 auto}.display-block{display:block}.display-inline{display:inline}.display-inline-block{display:inline-block}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.flex-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-flow:column wrap;-ms-flex-flow:column wrap;flex-flow:column wrap;-webkit-justify-content:baseline;-ms-flex-pack:baseline;justify-content:baseline;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}@media (min-width:77rem){.flex-container{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}}.flex-item{-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto}@media (min-width:77rem){.flex-item{-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0;margin-right:2rem}}.axis line,.axis path{fill:none;stroke:#000;shape-rendering:crispEdges}.x.axis path{display:none}.line{fill:none;stroke:"#ff0000";stroke-width:0}.tooltip{text-anchor:middle;fill:"#ff0000";stroke:0}.map-container{position:fixed;height:100%;width:38%}#map{position:absolute;top:0;bottom:0;width:100%}.reticle{position:absolute;top:49%;left:49%;z-index:100}.content{position:relative;margin-left:38%;padding-left:2rem}.title{font-family:ff-prater-script-web;font-size:3em;position:relative;bottom:10px;color:red;padding-left:10px}h2{color:#aaa;text-transform:uppercase;border-bottom:1px dotted #eee}.d3-tip{line-height:1;font-weight:700;padding:12px;background:rgba(0,0,0,.8);color:#fff;border-radius:2px}.d3-tip:after{box-sizing:border-box;display:inline;font-size:10px;width:100%;line-height:1;color:rgba(0,0,0,.8);content:"\25BC";position:absolute;text-align:center}.d3-tip.n:after{margin:-1px 0 0;top:100%;left:0}.pos{color:red}.neg{color:green}.fc{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between} \ No newline at end of file +/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}td,th{padding:0}*,:after,:before{box-sizing:border-box}body,button{margin:0}button,input,select,textarea{font-family:inherit;font-size:100%}img{max-width:100%}svg{max-height:100%}.btn,.btn:link,.btn:visited{border-radius:.3em;border-style:solid;border-width:1px;color:#111;display:inline-block;letter-spacing:.15em;text-decoration:none;text-transform:uppercase;transition:color .4s,background-color .4s,border .4s}.btn:hover{color:#7FDBFF;border:1px solid #7FDBFF;transition:background-color .3s,color .3s,border .3s}.btn:active{color:#0074D9;border:1px solid #0074D9;transition:background-color .3s,color .3s,border .3s}.btn--s{font-size:12px}.btn--m{font-size:14px}.btn--l{font-size:20px;border-radius:.25em!important}.btn--full,.btn--full:link{border-radius:.25em;display:block;margin-left:auto;margin-right:auto;text-align:center;width:100%}.btn--black,.btn--black:link,.btn--black:visited{color:#fff;background-color:#000}.btn--black:hover{color:#fff;border-color:#777}.btn--black:active{color:#fff;background-color:#999;border-color:#999}.btn--black:hover{background-color:#444}.btn--black{background-color:#000},.btn--gray:link,.btn--gray:visited{background-color:#f0f0f0;border-color:#f0f0f0;color:#555}.btn--gray:hover{background-color:#ddd;border-color:#ddd;color:#444}.btn--gray:active{background-color:#ccc;border-color:#ccc;color:#444},.btn--gray-border:link,.btn--gray-border:visited{background-color:#fff;border-color:#555;border-width:2px;color:#555}.btn--gray-border:hover{background-color:#fff;border-color:#ddd;color:#777}.btn--gray-border:active{background-color:#ccc;border-color:#ccc;color:#444}.btn--gray-dark:link,.btn--gray-dark:visited{background-color:#555;color:#eee}.btn--gray-dark:hover{background-color:#333;border-color:#333;color:#eee}.btn--gray-dark:active{background-color:#777;border-color:#777;color:#eee}.btn--blue:link,.btn--blue:visited{color:#fff;background-color:#0074D9}.btn--blue:hover{color:#fff!important;background-color:#0063aa;border-color:#0063aa}.btn--blue:active{color:#fff;background-color:#001F3F;border-color:#001F3F}.btn--animated{background:#f9f9f9;color:#444;border:4px solid #f1f1f1;padding:.5rem;transition:padding .4s ease-out;transition-delay:.1s}.btn--animated:hover{background:#f9f9f9;border:4px solid #f1f1f1;padding:.75rem;transition:padding .2s ease-in}@media screen and (min-width:32em){.btn--full{max-width:16em!important}}.input-text{outline:0;border:1px solid #eee}.input-invisible{outline:0;border:0}.bg-navy{background-color:#001F3F}.bg-blue{background-color:#0074D9}.bg-aqua{background-color:#7FDBFF}.bg-teal{background-color:#39CCCC}.bg-olive{background-color:#3D9970}.bg-green{background-color:#2ECC40}.bg-lime{background-color:#01FF70}.bg-yellow{background-color:#FFDC00}.bg-orange{background-color:#FF851B}.bg-red{background-color:#FF4136}.bg-fuchsia{background-color:#F012BE}.bg-purple{background-color:#B10DC9}.bg-maroon{background-color:#85144B}.bg-white{background-color:#fff}.bg-gray{background-color:#aaa}.bg-silver{background-color:#ddd}.bg-black{background-color:#111}.navy{color:#001F3F}.blue{color:#0074D9}.aqua{color:#7FDBFF}.teal{color:#39CCCC}.olive{color:#3D9970}.green{color:#2ECC40}.lime{color:#01FF70}.yellow{color:#FFDC00}.orange{color:#FF851B}.red{color:#FF4136}.fuchsia{color:#F012BE}.purple{color:#B10DC9}.maroon{color:#85144B}.white{color:#fff}.silver{color:#ddd}.gray{color:#aaa}.black{color:#111}.border--navy{border-color:#001F3F}.border--blue{border-color:#0074D9}.border--aqua{border-color:#7FDBFF}.border--teal{border-color:#39CCCC}.border--olive{border-color:#3D9970}.border--green{border-color:#2ECC40}.border--lime{border-color:#01FF70}.border--yellow{border-color:#FFDC00}.border--orange{border-color:#FF851B}.border--red{border-color:#FF4136}.border--fuchsia{border-color:#F012BE}.border--purple{border-color:#B10DC9}.border--maroon{border-color:#85144B}.border--white{border-color:#fff}.border--gray{border-color:#aaa}.border--silver{border-color:#ddd}.border--black{border-color:#111}.fill-navy{fill:#001F3F}.fill-blue{fill:#0074D9}.fill-aqua{fill:#7FDBFF}.fill-teal{fill:#39CCCC}.fill-olive{fill:#3D9970}.fill-green{fill:#2ECC40}.fill-lime{fill:#01FF70}.fill-yellow{fill:#FFDC00}.fill-orange{fill:#FF851B}.fill-red{fill:#FF4136}.fill-fuchsia{fill:#F012BE}.fill-purple{fill:#B10DC9}.fill-maroon{fill:#85144B}.fill-white{fill:#fff}.fill-gray{fill:#aaa}.fill-silver{fill:#ddd}.fill-black{fill:#111}.stroke-navy{stroke:#001F3F}.stroke-blue{stroke:#0074D9}.stroke-aqua{stroke:#7FDBFF}.stroke-teal{stroke:#39CCCC}.stroke-olive{stroke:#3D9970}.stroke-green{stroke:#2ECC40}.stroke-lime{stroke:#01FF70}.stroke-yellow{stroke:#FFDC00}.stroke-orange{stroke:#FF851B}.stroke-red{stroke:#FF4136}.stroke-fuchsia{stroke:#F012BE}.stroke-purple{stroke:#B10DC9}.stroke-maroon{stroke:#85144B}.stroke-white{stroke:#fff}.stroke-gray{stroke:#aaa}.stroke-silver{stroke:#ddd}.stroke-black{stroke:#111}.pan{padding:0}.paxs{padding:.25rem}.pas{padding:.5rem}.pam{padding:1rem}.pal{padding:2rem}.pax{padding:4rem}.pln{padding-left:0}.plxs{padding-left:.25rem}.pls{padding-left:.5rem}.plm{padding-left:1rem}.pll{padding-left:2rem}.plx{padding-left:4rem}.prn{padding-right:0}.prxs{padding-right:.25rem}.prs{padding-right:.5rem}.prm{padding-right:1rem}.prl{padding-right:2rem}.prx{padding-right:4rem}.pbn{padding-bottom:0}.pbxs{padding-bottom:.25rem}.pbs{padding-bottom:.5rem}.pbm{padding-bottom:1rem}.pbl{padding-bottom:2rem}.pbx{padding-bottom:4rem}.ptn{padding-top:0}.ptxs{padding-top:.25rem}.pts{padding-top:.5rem}.ptm{padding-top:1rem}.ptl{padding-top:2rem}.ptx{padding-top:4rem}.pvn{padding-top:0;padding-bottom:0}.pvxs{padding-top:.25rem;padding-bottom:.25rem}.pvs{padding-top:.5rem;padding-bottom:.5rem}.pvm{padding-top:1rem;padding-bottom:1rem}.pvl{padding-top:2rem;padding-bottom:2rem}.pvx{padding-top:4rem;padding-bottom:4rem}.phn{padding-left:0;padding-right:0}.phxs{padding-left:.25rem;padding-right:.25rem}.phs{padding-left:.5rem;padding-right:.5rem}.phm{padding-left:1rem;padding-right:1rem}.phl{padding-left:2rem;padding-right:2rem}.phx{padding-left:4rem;padding-right:4rem}.man{margin:0}.maxs{margin:.25rem}.mas{margin:.5rem}.mam{margin:1rem}.mal{margin:2rem}.max{margin:4rem}.mln{margin-left:0}.mlxs{margin-left:.25rem}.mls{margin-left:.5rem}.mlm{margin-left:1rem}.mll{margin-left:2rem}.mlx{margin-left:4rem}.mrn{margin-right:0}.mrxs{margin-right:.25rem}.mrs{margin-right:.5rem}.mrm{margin-right:1rem}.mrl{margin-right:2rem}.mrx{margin-right:4rem}.mbn{margin-bottom:0}.mbxs{margin-bottom:.25rem}.mbs{margin-bottom:.5rem}.mbm{margin-bottom:1rem}.mbl{margin-bottom:2rem}.mbx{margin-bottom:4rem}.mtn{margin-top:0}.mtxs{margin-top:.25rem}.mts{margin-top:.5rem}.mtm{margin-top:1rem}.mtl{margin-top:2rem}.mtx{margin-top:4rem}.mvn{margin-top:0;margin-bottom:0}.mvxs{margin-top:.25rem;margin-bottom:.25rem}.mvs{margin-top:.5rem;margin-bottom:.5rem}.mvm{margin-top:1rem;margin-bottom:1rem}.mvl{margin-top:2rem;margin-bottom:2rem}.mvx{margin-top:4rem;margin-bottom:4rem}.mhn{margin-left:0;margin-right:0}.mhs{margin-left:.5rem;margin-right:.5rem}.mhm{margin-left:1rem;margin-right:1rem}.mhl{margin-left:2rem;margin-right:2rem}.mhx{margin-left:4rem;margin-right:4rem}html{text-rendering:optimizeLegibility;-webkit-font-feature-settings:kern;-moz-font-feature-settings:kern;font-feature-settings:kern}body{font-size:1rem;font-family:fira-sans;font-weight:400;color:#444;line-height:1.5}html{font-size:15px}@media screen and (min-width:40rem){html{font-size:16px}}@media screen and (min-width:50rem){html{font-size:17px}}@media screen and (min-width:60rem){html{font-size:18px}}h1,h2,h3,h4,h5,h6{font-family:fira-sans;color:#222;font-weight:500;margin:0 0 1rem}.h1,h1{font-size:1.777778rem}.h2,h2{font-size:1.333333rem}.h3,.h4,.h5,.h6,h3,h4,h5,h6{font-size:1rem}p{font-size:1rem;max-width:40rem;margin:0 0 1rem}blockquote{font-style:italic;font-size:1rem}.light{font-weight:300}.book{font-weight:400}.medium{font-weight:500}.semibold{font-weight:600}.bold{font-weight:700}.black{font-weight:900}.uppercase{text-transform:uppercase}.italic{font-style:italic}a{color:#00e;font-weight:500;text-decoration:none;transition:.2s ease-in}a:active a:visited,a:link{color:#00e}a:hover{color:#0080ff;transition:color .2s ease-out}li{list-style-type:none}.hanging{padding-left:0}table{border-collapse:collapse;border-spacing:0;max-width:100%}th{text-align:left;font-weight:700}td,th{line-height:inherit}th{vertical-align:bottom}td{vertical-align:top}tr{border-bottom:2px solid #f4f4f4}.container{max-width:40rem}.center{margin:0 auto}.display-block{display:block}.display-inline{display:inline}.display-inline-block{display:inline-block}.align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right}.flex-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-flow:column wrap;-ms-flex-flow:column wrap;flex-flow:column wrap;-webkit-justify-content:baseline;-ms-flex-pack:baseline;justify-content:baseline;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}@media (min-width:77rem){.flex-container{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}}.flex-item{-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto}@media (min-width:77rem){.flex-item{-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0;margin-right:2rem}}.axis line,.axis path{fill:none;stroke:#000;shape-rendering:crispEdges}.y.axis line,.y.axis path{display:none}.line{fill:none;stroke:"#ff0000";stroke-width:0}.tooltip{text-anchor:middle;fill:"#ff0000";stroke:0}#map{position:absolute;top:0;bottom:0;width:100%}.reticle{position:absolute;top:49%;left:49%;z-index:100}.title{font-family:ff-prater-script-web;font-size:3em;position:relative;bottom:10px;padding-left:10px}h2{color:#aaa;text-transform:uppercase;border-bottom:1px dotted #eee}.d3-tip{line-height:1;font-weight:700;padding:12px;background:rgba(0,0,0,.8);color:#fff;border-radius:2px}.b-y{border-bottom:4px solid #e09200}.b-o{border-bottom:4px solid #ffbe1a}.b-r{border-bottom:4px solid #fde668}.d3-tip:after{box-sizing:border-box;display:inline;font-size:10px;width:100%;line-height:1;color:rgba(0,0,0,.8);content:"\25BC";position:absolute;text-align:center}.d3-tip.n:after{margin:-1px 0 0;top:100%;left:0}.pos{color:red}svg{max-width:100%}footer ul{padding-left:0}footer li{display:inline;word-spacing:5px}.button{font-weight:700;border:2px solid #eee;padding:3px 10px;background:#f6f6f6}.italic{color:#aaa}.no-mobile{display:none}header{margin-top:2rem}header a:hover{color:red}.title h1{font-size:2rem}.title img{height:80px}.map-container{position:absolute;height:50vh;width:100%}.content{position:relative;margin-top:50vh;padding:2rem}@media (min-width:45em){.no-desktop{display:none}.no-mobile{display:block}.title h1{font-size:1rem}.map-container{position:fixed;height:100%;width:38%}.content{margin-top:0;position:relative;margin-left:38%;padding-left:2rem;width:61%}} \ No newline at end of file diff --git a/seattle/seattle/static/css/src/d3.css b/seattle/seattle/static/css/src/d3.css index 66ce329..eb2e75e 100644 --- a/seattle/seattle/static/css/src/d3.css +++ b/seattle/seattle/static/css/src/d3.css @@ -5,9 +5,14 @@ shape-rendering: crispEdges; } -.x.axis path { +.y.axis path, +.y.axis line { display: none; } +.x.axis path, +.x.axis line { + /* display: none; */ +} .line { fill: none; diff --git a/seattle/seattle/static/css/src/index.css b/seattle/seattle/static/css/src/index.css index 7ffacb6..5ac0f37 100644 --- a/seattle/seattle/static/css/src/index.css +++ b/seattle/seattle/static/css/src/index.css @@ -18,11 +18,6 @@ --copy-font-color: #444; } -.map-container { - position: fixed; - height: 100%; - width: 38%; -} #map { position: absolute; @@ -38,18 +33,11 @@ z-index: 100; } -.content { - position: relative; - margin-left: 38%; - padding-left: 2rem; -} - .title { font-family: 'ff-prater-script-web'; font-size: 3em; position: relative; bottom: 10px; - color: red; padding-left: 10px; } @@ -68,6 +56,10 @@ h2 { border-radius: 2px; } +.b-y { border-bottom: 4px solid #e09200;} +.b-o { border-bottom: 4px solid #ffbe1a;} +.b-r { border-bottom: 4px solid #fde668;} + /* Creates a small triangle extender for the tooltip */ .d3-tip:after { box-sizing: border-box; @@ -92,13 +84,64 @@ h2 { color: #ff0000; } -.neg { - color: green; +svg { + max-width: 100%; } -.fc { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; +footer ul { padding-left: 0;} +footer li { + display: inline; + word-spacing: 5px; } + +.button { + font-weight: bold; + border: 2px solid #eee; + padding: 3px 10px; + background: #f6f6f6; +} + +.italic { + color: #aaa; +} + + +/* RWD (kek) */ +/* Mobile styles */ +.no-mobile { display: none; } +header { margin-top: 2rem; } +header a:hover { color: #ff0000; } +.title h1 { font-size: 2rem; } +.title img { height: 80px;} +.map-container { + position: absolute; + height: 50vh; + width: 100%; +} +.content { + position: relative; + margin-top: 50vh; + padding: 2rem; +} + +@media (min-width:45em) { + .no-desktop { display: none; } + .no-mobile { display: block; } + .title h1 { + font-size: 1rem; + } + .map-container { + position: fixed; + height: 100%; + width: 38%; + } + .content { + margin-top: 0; + position: relative; + margin-left: 38%; + padding-left: 2rem; + width: 61%; + } + +} + diff --git a/seattle/seattle/static/js/map.js b/seattle/seattle/static/js/map.js index c277452..70667db 100644 --- a/seattle/seattle/static/js/map.js +++ b/seattle/seattle/static/js/map.js @@ -14,14 +14,16 @@ var map = L.mapbox.map('map', 'jacques.la14ofjk', { minZoom: 12 }); - +map.addControl(L.mapbox.geocoderControl('mapbox.places', { + keepOpen: true +})); // Disable scrollwheel zoom map.scrollWheelZoom.disable(); function graph() { - var w = 960, + var w = 720, h = 500, - p = [50, 40, 40, 20], + p = [30, 20, 40, 0], x = d3.scale.ordinal().rangeRoundBands([0, w - p[1] - p[3]]), y = d3.scale.linear().range([0, h - p[0] - p[2]]), z = d3.scale.ordinal().range(["#FDE668", "#FFBE1A", "#E09200"]) @@ -41,6 +43,13 @@ function graph() { .append("svg:g") .attr("transform", "translate(" + p[3] + "," + (h - p[2]) + ")"); + var today = new Date(); + var past = new Date(today.getDate() - 365); + // var past-year = (today.getDate() - 365); //<<===== no need + // var mm = today.getMonth()+1; //January is 0! //<<===== no need + // var yyyy = today.getFullYear(); //<<===== no need + + svg.call(tip); // Transpose the data into layers by type. @@ -55,11 +64,21 @@ function graph() { y.domain([0, d3.max(incidents[incidents.length - 1], function(d) { return d.y0 + d.y; })]); yx.domain([d3.max(incidents[incidents.length - 1], function(d) { return d.y0 + d.y; }), 0]); + // svg.append("line") + // .scale(x) + // .attr("x1", x(past)) //<<== change your code here + // .attr("y1", 0) + // .attr("x2", x(past)) //<<== and here + // .attr("y2", h - p[0] - p[2]) + // .style("stroke-width", 2) + // .style("stroke", "red") + // .style("fill", "none"); + // Define the axes var xAxis = d3.svg.axis() .scale(x) .orient("bottom") - .ticks(5); + .ticks(20); // svg.append("g") // .attr("class", "x axis") @@ -70,20 +89,20 @@ function graph() { // .attr("x", 9) // .attr("dy", ".35em") // .attr("transform", "rotate(90)") - // .style("text-anchor", "start") - // .text(format); + // .style("text-anchor", "start"); var yAxis = d3.svg.axis() .scale(yx) .orient("left") .ticks(5); - // svg.append("g") - // .attr("class", "y axis") - // .attr("transform", "translate(" + (p[1] + p[3] - 12) + "," + -(h - p[2] - p[0]) + ")") - // .call(yAxis) - // .selectAll("text") - // .style("text-anchor", "start"); + svg.append("g") + .attr("class", "y axis") + .attr("transform", "translate(" + (p[1] + p[3] - 12) + "," + -(h - p[2] - p[0]) + ")") + .call(yAxis) + .selectAll("text") + .style("text-anchor", "start") + .attr("font-style", "italic"); // Add a group for each cause. var incident = svg.selectAll("g.incident") @@ -107,7 +126,7 @@ function graph() { function groupedbar() { var margin = {top: 20, right: 20, bottom: 30, left: 40}, - width = 960 - margin.left - margin.right, + width = 720 - margin.left - margin.right, height = 500 - margin.top - margin.bottom; var x0 = d3.scale.ordinal() @@ -119,7 +138,7 @@ function groupedbar() { .range([height, 0]); var color = d3.scale.ordinal() - .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]); + .range(["#EEE", "FF0000"]); var xAxis = d3.svg.axis() .scale(x0) @@ -216,6 +235,7 @@ map.on('moveend', function(e) { $(".graph").contents().remove(); $(".groupedbar").contents().remove(); graph(); + groupedbar(); } diff --git a/seattle/seattle/templates/index.jinja2 b/seattle/seattle/templates/index.jinja2 index f4cea40..c47e0c0 100644 --- a/seattle/seattle/templates/index.jinja2 +++ b/seattle/seattle/templates/index.jinja2 @@ -1,35 +1,67 @@ {% extends 'base.jinja2' %} {% block body %} + +
+ + +

Seamergency!!!

+ +
+ +
+
+

Seattle is changing. This is how.

+
o
+
-
- + +
+

Seamergency!!!
-
-
-

In the last year, in - {{neigh}}, - {{lat}}, - {{lon}}.

+
+
+

These statistics are from Seattle 911 Fire Department calls from 2004 to present. They represent a dispatch by emergency services to a location within half of a kilometer of the location displayed.

-
    -
  • Crime has {{percentages.Crime|safe}}: Number in last year: {{ counts.Crime }}
    • -
  • Fires have {{percentages.Fire|safe}}: Number in last year: {{ counts.Fire }}
    • -
  • Incidents have {{percentages.MVI|safe}}: Number in last year: {{ counts.MVI }}
    • -
  • Total records: {{count}}
    • +

    Within the last year,

    +

    In + + {{ neigh }} at + + {{ lat }}, {{ lon }} +

    + +
      + +
    • Fire alarms have + {{percentages.Fire|safe}} + (+{{ counts.Fire }}) +
      • + +
    • Traffic incidents have + {{percentages.MVI|safe}} + (+{{ counts.MVI }}) +
      • + +
    • Violent crime has + {{percentages.Crime|safe}} + (+{{ counts.Crime }}) +
      • +
+
@@ -50,6 +82,20 @@ - +
+ {% endblock %}