From fc7529306d5154366f840f2a428872b71da3ceed Mon Sep 17 00:00:00 2001 From: Michael Polidori Date: Fri, 25 Feb 2022 19:26:30 -0500 Subject: [PATCH] Feature/line width (#523) --- ckanext/querytool/controllers/querytool.py | 17 +-- ckanext/querytool/fanstatic/css/main.css | 2 +- .../javascript/dist/modules/viz-preview.js | 127 ++++++++++++++++-- .../dist/visualizations_settings.js | 15 ++- .../querytool/fanstatic/javascript/vitals.js | 2 +- ckanext/querytool/fanstatic/less/main.less | 33 +++++ .../templates/ajax_snippets/chart_item.html | 33 ++++- .../ajax_snippets/visualization_item.html | 1 + .../templates/querytool/public/read.html | 3 +- 9 files changed, 200 insertions(+), 33 deletions(-) diff --git a/ckanext/querytool/controllers/querytool.py b/ckanext/querytool/controllers/querytool.py index ac6fe35a..b7221b3f 100644 --- a/ckanext/querytool/controllers/querytool.py +++ b/ckanext/querytool/controllers/querytool.py @@ -429,23 +429,24 @@ def edit_visualizations(self, querytool=None, data=None, visualization['plotly'] = \ data.get('chart_field_plotly_{}'.format(id)) - def line_type_search(data, id): - base_id = 'chart_field_line_type_{}_'.format(id) + def line_attr_search(data, id, line_attr): + base_id = 'chart_field_{}_{}_'.format(line_attr, id) line_count = len([ True for key, value in data.items() if base_id in key ]) - line_types = [] + line_attrs = [] for i in range(1, line_count + 1): - line_type_id = base_id + str(i) + line_attr_id = base_id + str(i) - if line_type_id in data: - line_types.append(data[line_type_id]) + if line_attr_id in data: + line_attrs.append(data[line_attr_id]) - return ','.join(line_types) + return ','.join(line_attrs) - visualization['line_types'] = line_type_search(data, id) + visualization['line_types'] = line_attr_search(data, id, 'line_type') + visualization['line_widths'] = line_attr_search(data, id, 'line_width') bar_width = data.get('chart_field_bar_width_{}'.format(id)) diff --git a/ckanext/querytool/fanstatic/css/main.css b/ckanext/querytool/fanstatic/css/main.css index 802b2629..e4811d4e 100644 --- a/ckanext/querytool/fanstatic/css/main.css +++ b/ckanext/querytool/fanstatic/css/main.css @@ -1 +1 @@ -@import url(//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css);@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsgH1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsg-1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:800;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgshZ1y4n.ttf) format('truetype')}.dataTable .dt-button{margin:auto 2px}.dataTable .dt-button span:before{margin-right:5px;font-family:FontAwesome;content:"\f019"}.dataTable .dataTables_wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dataTable .dataTables_wrapper table{min-width:100%;table-layout:auto;word-break:break-all}.dataTable .dataTables_wrapper .paginate_button:hover{background:#0056ff;border-color:#003499}.dataTable .dataTables_wrapper .paginate_button.disabled,.dataTable .dataTables_wrapper .paginate_button.disabled:hover{background:0 0;border:transparent}.dataTable .dataTables_wrapper .paginate_button.current,.dataTable .dataTables_wrapper .paginate_button.current:hover{color:#fff!important;background:#0056ff;border-color:#0056ff}.dataTable .dataTables_wrapper input{vertical-align:baseline}.dataTable .dataTables_wrapper select{margin:0 5px;vertical-align:baseline}.dataTable .dataTables_wrapper label{font-weight:500;margin-bottom:0}.dataTable .dataTables_wrapper label:after{display:none}.dataTable .dataTables_wrapper .dataTables_filter input{margin-bottom:0}.dataTable .dataTables_wrapper .dataTables_filter,.dataTable .dataTables_wrapper .dataTables_length,.dataTable .dataTables_wrapper .dt-buttons{background:#f7f7f7;border:1px solid #ccc;padding:10px 20px;margin-bottom:20px;border-radius:3px}.dataTable .dataTables_wrapper .dataTable th,.dataTable .dataTables_wrapper .dataTable.no-footer{border-color:#ccc}.dataTable .dataTables_wrapper .dataTables_empty,.dataTable .dataTables_wrapper .dataTables_info{color:#999}.dataTable .dataTables_wrapper .dataTables_info,.dataTable .dataTables_wrapper .dataTables_paginate{margin:10px 0}.dataTable .dataTables_wrapper .dataTables_info{-webkit-box-flex:1;-ms-flex:auto;flex:auto}.toolbar .breadcrumb{font-size:14px}.toolbar .breadcrumb li::after{margin-left:5px;margin-right:5px}body{font-family:'Open Sans',sans-serif;background-image:none;background-color:#0056ff}a{color:#0056ff}.homepage .module-search .module-content{background-color:#0056ff}.homepage .module-search .tags{background-color:#292929}.text-primary{color:#0056ff}.account-masthead{background-color:#d2d2d2;background-image:none}.account-masthead .account ul li{border-left:1px solid #a7a7a7}.account-masthead .account ul li a{color:#2f2f2f}.account-masthead .account ul li a:hover{color:rgba(255,255,255,.9);background-color:#0056ff}.masthead{background-color:#e8e8e8;background-image:none;height:auto}.masthead .navigation .nav-pills li a{margin:0;padding:15px;border-bottom:5px solid transparent;color:#000;font-weight:500}.masthead .navigation .nav-pills li a:hover{background-color:transparent;border-radius:0;border-bottom:5px solid rgba(0,86,255,.7);-webkit-box-shadow:none;box-shadow:none;color:rgba(0,0,0,.7)}.masthead .navigation .nav-pills li.active a{background-color:transparent;border-radius:0;border-bottom:5px solid #0056ff;-webkit-box-shadow:none;box-shadow:none;color:rgba(0,0,0,.7)}.masthead .site-search{float:right;margin-top:5px}.masthead .nav>li>a{color:rgba(255,255,255,.7)}.masthead #field-sitewide-search:focus{-webkit-box-shadow:inset 0 0 0 1px #0056ff;box-shadow:inset 0 0 0 1px #0056ff;border-color:#0056ff}.masthead input[type=text]{border-color:#ababab}.nav-tabs a .fa{display:inline}.nav-tabs a .fa:after{content:'';margin:0 3px 0 0}.btn{background-image:none;-webkit-box-shadow:none;box-shadow:none;border-radius:4px}.btn:hover{-webkit-box-shadow:none;box-shadow:none;background-color:#0047d4;color:#fff}.primary .btn .fa,.public-query .btn .fa,.secodary .btn .fa,.site-footer .btn .fa{display:inline}.primary .btn .fa:after,.public-query .btn .fa:after,.secodary .btn .fa:after,.site-footer .btn .fa:after{content:'';margin:0 3px 0 0}.btn-primary{background-color:#0056ff}.btn-primary:focus{background-color:#0056ff}.btn-primary:hover{background-color:#0047d4}.btn-secondary{background-color:#003499;border-color:#0056ff;color:#fff;text-shadow:none}.btn-secondary:focus,.btn-secondary:hover{color:#fff;background-color:#002b80}.btn-danger{background-color:#cf0000}.btn,label{font-weight:400}.btn-large .caret{margin-top:8px;margin-left:5px}.btn-download,.btn-download .btn-group{display:-webkit-box;display:-ms-flexbox;display:flex}.btn-download .btn,.btn-download .btn-group .btn{padding:20px}.btn-download .btn{padding-left:30px;padding-right:30px;font-weight:500;font-size:20px;font-family:inherit;border:transparent}.btn-update{font-size:20px;padding:20px;border-color:transparent;font-weight:500;font-family:inherit;border-radius:4px}.btn-filter-toggle.on{border-color:#51a351;background-color:#51a351}.btn-chart-download{cursor:pointer;float:right;z-index:10;color:#000;font-size:1em}.form-actions .btn{margin-left:10px}.btn-ordinary{background-color:#d2d2d2}.btn-ordinary:active,.btn-ordinary:focus,.btn-ordinary:hover{background-color:#e8e8e8;color:#000}.site-footer{background-color:#232323}.site-footer .container{padding-top:20px;padding-bottom:20px}.site-footer a{color:rgba(255,255,255,.7)}.site-footer .dropdown-toggle{color:#292929}.site-footer input[type=text]{border-color:#ccc}.site-footer,.site-footer label,.site-footer small{color:rgba(255,255,255,.7)}.uneditable-input,input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{border-radius:0}.dropdown-menu{border-radius:0}.search-form .search-input.search-giant button{margin-top:-15px}.search-giant .search:focus{-webkit-box-shadow:inset 0 0 0 2px #0056ff;box-shadow:inset 0 0 0 2px #0056ff;border-color:#0056ff}.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover{background:#0056ff}.dropdown-submenu:focus>a,.dropdown-submenu:hover>a{background:#0056ff}.control-checkbox-group input[type=checkbox]{top:0}.control-checkbox-group input[type=checkbox]:checked+label{font-weight:700;text-decoration:underline}.control-checkbox-group label{padding:0 5px;margin-left:5px;margin-bottom:0}.control-checkbox-group label:after{content:''}.query-item{border:1px solid #c4c4c4;padding:10px 20px;margin:10px 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.query-body{margin:0 20px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.query-body h2{margin-bottom:0}.query-actions{-ms-flex-negative:0;flex-shrink:0;margin-bottom:0}.filter_item{border-bottom:1px solid #dedede;border-radius:5px;margin:20px 0}.chart-actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;bottom:0;width:100%}.chart-actions.inline>li:last-child{padding-right:0}.visualization-fields-section{position:relative;border:1px solid #c4c4c4;padding:20px;margin-bottom:10px;background:#f7f7f7;display:-webkit-box;display:-ms-flexbox;display:flex}.preview-wrapper{background:#fff;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:1px solid #dedede}.map .item-content{min-width:100%;min-height:500px}.item-wrapper textarea{min-height:300px;max-width:100%}.item-wrapper .control-group.title{margin-bottom:0}.item-wrapper .control-group.title textarea{min-height:60px}.item-wrapper .control-group.title-vars{margin-bottom:0}.item-wrapper .control-group.title-vars select{color:gray}.item-wrapper .control-group.title-vars option[value=""][disabled]{display:none}.item-wrapper .control-group.title-vars option{color:#000}.item-wrapper .control-group.title-help .controls{padding:4px 10px;background-color:#ebebeb;border:solid 1px #ccc;font-size:11px}.item-wrapper .control-group.title-help a{color:#187794}.item-wrapper .control-group.title-help pre{word-break:normal}.item-wrapper .control-group.title-help .popover-content{word-break:normal}.chart-controls-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.tool-embed{color:#000!important}.related-query-item{margin-bottom:20px}.related-query-item .control-group{margin-bottom:0}.related-query-item .filter-actions{margin-right:20px;margin-bottom:0}.filter-actions{margin-right:20px}hr{border-top-color:#dedede}.c3-title{font-size:15px!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.c3-axis,.c3-chart-texts{font-size:12px!important}.c3-line{stroke-width:3px}.c3-grid text{fill:#000}.c3 .c3-ygrid-line.base{display:block}.c3 .c3-ygrid-line.active{display:none}.c3:hover .c3-ygrid-line.base{display:none}.c3:hover .c3-ygrid-line.active{display:block}.c3:hover .c3-ygrid-line.active text{font-size:125%;font-weight:700}.c3:hover .c3-ygrid-line.active line{stroke:#000}table.dataTable thead th{font-size:15px;background-color:#f5f5f5}table.dataTable tbody td{font-size:15px}.dt-header{font-size:22px}.dataTables_length{margin-right:10px}.dataTables_length>label>select{width:60px}.dataTables_filter>label>input{width:120px}.dt-buttons{margin-top:5px}.filter-color-picker{width:210px;border:1px solid #ccc;height:22px;padding:4px}@media (min-width:1200px){.wrap-btn-save-visualizations{z-index:99999;position:fixed;top:210px;right:44px;text-align:right}.wrap-btn-save-visualizations .btn.btn-success{margin:0}.public-query .item{position:relative;text-align:left;display:inline-block;float:left}.public-query .item.has-filter.size-sm .c3{max-height:126px}.public-query .item.has-filter.size-sm.square .c3{max-height:396px}.public-query .item.has-filter.size-md .c3{max-height:376px}.public-query .item.has-filter.size-md.vertical .c3{max-height:936px}.public-query .item.has-filter.size-lg .c3{max-height:376px}.public-query .item.has-filter.size-lg.square .c3{max-height:936px}.public-query .item.has-filter.size-lg.vertical .c3{max-height:936px}.public-query .item.size-sm{width:calc(31.8047619%);height:250px}.public-query .item.size-sm.double{width:calc(65.13809524%)}.public-query .item.size-sm.square{height:520px}.public-query .item.size-sm.vertical{height:1060px}.public-query .item.size-sm.wide{clear:both;width:calc(98.47142857%)}.public-query .item.size-md{width:calc(73.47142857%);height:520px}.public-query .item.size-md.vertical{height:1060px}.public-query .item.size-lg{width:calc(48.47142857%);height:520px}.public-query .item.size-lg.square{width:calc(65.13809524%);height:1060px}.public-query .item.size-lg.vertical{height:1060px}.public-query .item.size-xl{clear:both;width:calc(98.47142857%);height:520px}}@media (min-width:980px){.masthead{padding-top:10px}.masthead .nav-collapse{float:none}.masthead .navigation.default-menu{float:right}.preview-wrapper{margin-left:20px}}@media (max-width:1199px){.masthead .site-search input{width:10px}.masthead .site-search input::-webkit-input-placeholder{color:#fff}.masthead .site-search input::-moz-placeholder{color:#fff}.masthead .site-search input::-ms-input-placeholder{color:#fff}.masthead .site-search input::placeholder{color:#fff}.public-query .image img{width:100%;height:auto}}@media (min-width:768px){.visualization-fields-section{padding-left:60px}}@media (max-width:979px){.dataTables_wrapper .dataTables_filter,.dataTables_wrapper .dataTables_length,.dataTables_wrapper .dt-buttons{text-align:left;-ms-flex-preferred-size:100%;flex-basis:100%}.masthead .btn-navbar{background-color:#292929}.masthead .btn-navbar.active,.masthead .btn-navbar:focus,.masthead .btn-navbar:hover{background-color:#5c5c5c}.btn-navbar{margin:10px 0}.toolbar{margin-bottom:0}.toolbar .breadcrumb .home{display:inline-block}.masthead .navigation{float:none}.masthead .navigation .nav-pills{margin-bottom:20px}.public-query .container-chart{-webkit-box-flex:1;-ms-flex:auto;flex:auto}.size-lg.chart .item-content{height:500px!important}.public-query .item.chart{margin-right:0;padding-left:10px!important;padding-right:10px!important}.public-query .item{margin-left:0!important}.public-query .item-content.c3{min-height:460px}.public-query .c3-title{font-size:12px!important}.public-query .visualizations{padding-right:0!important}.c3-axis-y text{font-size:8px;font-weight:300}.c3-axis-x text{font-size:9px;font-weight:300}}@media (max-width:767px){.container-wrapper{background:0 0}}body{background-image:none;background-color:#fff}.map-info{padding:6px 8px;font:14px/16px Arial,Helvetica,sans-serif;background:#fff;background:rgba(255,255,255,.8);-webkit-box-shadow:0 0 15px rgba(0,0,0,.2);box-shadow:0 0 15px rgba(0,0,0,.2);border-radius:5px}.map-info h4{margin:0 0 5px;color:#777}.legend{font:14px/16px Arial,Helvetica,sans-serif;background:#fff;background:rgba(255,255,255,.8);-webkit-box-shadow:0 0 15px rgba(0,0,0,.2);box-shadow:0 0 15px rgba(0,0,0,.2);border-radius:5px;list-style:none}.legend span{width:16px;height:16px;float:left;margin-right:8px;border:1px solid #969696}.accordion-heading{background-color:#e8e8e8}.accordion-group{background-color:#fff}.accordion-toggle:after{font-family:FontAwesome;content:"\f078";float:right}.accordion-opened .accordion-toggle:after{content:"\f077"}.c3-axis-y text{font-size:11px;font-weight:800;font-family:'Open Sans',sans-serif;letter-spacing:-.2px}.c3-axis-x text{font-size:11px;font-weight:800;font-family:'Open Sans',sans-serif;letter-spacing:-.2px}.text-lowercase{text-transform:lowercase}.main,[role=main]{background:#fff;min-height:80vh}.box{border:0!important}.applicaitons-box{border-bottom:1px solid #bfbfbf;margin-bottom:20px}.applicaitons-box .thumb{display:inline-block;float:left}.applicaitons-box .content-box{float:left;width:80%;margin-left:15px}.applicaitons-box .content-box h2{margin-top:0}.applicaitons-box ul{margin:0;padding:0;margin-bottom:20px}.applicaitons-box ul li{display:inline}.query-item ul{margin:0;padding:0;margin-bottom:20px}.query-item ul li{padding:0;display:inline}.applicaitons-box:last-child{border-bottom:0}.group-list{list-style:none;padding:0;margin:0}.group-list-item{border-bottom:1px solid #bfbfbf;padding-bottom:20px;padding-top:10px}.group-image{width:100px;height:60px;float:left;text-align:center;margin-right:20px}.group-image img{max-width:100%!important;max-height:100%!important;margin:0 auto!important}.tool-title{margin:0 0 20px 0!important}.show-read-more .more-text{display:none}.group-image-2{width:100px;height:60px;margin-left:10px;padding-right:20px;float:none}.group-image-2 img{max-width:100%!important;max-height:100%!important;margin:0 auto!important}.query-btn{display:block;margin-top:20px}.wrapper{border:0}.wrapper .row1{margin-top:10px;margin-bottom:0}.wrapper .homepage-box{margin:0}.plotly .xtick{font-weight:700!important}.plotly .legend .scrollbox .groups .traces .layers .legendsymbols .legendpoints .pointtext{display:none!important}.imgBtn{margin-top:10px!important;padding:12px 15px!important;float:right!important}.textbox_desc{width:400px}.textbox_dropdown{width:415px}.textbox_info{width:393px!important}.line-row{padding-bottom:13px;border-bottom:1px solid #eee;margin-bottom:10px}.line-row select{width:150px} \ No newline at end of file +@import url(//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css);@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsgH1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsg-1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:800;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v27/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgshZ1y4n.ttf) format('truetype')}.dataTable .dt-button{margin:auto 2px}.dataTable .dt-button span:before{margin-right:5px;font-family:FontAwesome;content:"\f019"}.dataTable .dataTables_wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dataTable .dataTables_wrapper table{min-width:100%;table-layout:auto;word-break:break-all}.dataTable .dataTables_wrapper .paginate_button:hover{background:#0056ff;border-color:#003499}.dataTable .dataTables_wrapper .paginate_button.disabled,.dataTable .dataTables_wrapper .paginate_button.disabled:hover{background:0 0;border:transparent}.dataTable .dataTables_wrapper .paginate_button.current,.dataTable .dataTables_wrapper .paginate_button.current:hover{color:#fff!important;background:#0056ff;border-color:#0056ff}.dataTable .dataTables_wrapper input{vertical-align:baseline}.dataTable .dataTables_wrapper select{margin:0 5px;vertical-align:baseline}.dataTable .dataTables_wrapper label{font-weight:500;margin-bottom:0}.dataTable .dataTables_wrapper label:after{display:none}.dataTable .dataTables_wrapper .dataTables_filter input{margin-bottom:0}.dataTable .dataTables_wrapper .dataTables_filter,.dataTable .dataTables_wrapper .dataTables_length,.dataTable .dataTables_wrapper .dt-buttons{background:#f7f7f7;border:1px solid #ccc;padding:10px 20px;margin-bottom:20px;border-radius:3px}.dataTable .dataTables_wrapper .dataTable th,.dataTable .dataTables_wrapper .dataTable.no-footer{border-color:#ccc}.dataTable .dataTables_wrapper .dataTables_empty,.dataTable .dataTables_wrapper .dataTables_info{color:#999}.dataTable .dataTables_wrapper .dataTables_info,.dataTable .dataTables_wrapper .dataTables_paginate{margin:10px 0}.dataTable .dataTables_wrapper .dataTables_info{-webkit-box-flex:1;-ms-flex:auto;flex:auto}.toolbar .breadcrumb{font-size:14px}.toolbar .breadcrumb li::after{margin-left:5px;margin-right:5px}body{font-family:'Open Sans',sans-serif;background-image:none;background-color:#0056ff}a{color:#0056ff}.homepage .module-search .module-content{background-color:#0056ff}.homepage .module-search .tags{background-color:#292929}.text-primary{color:#0056ff}.account-masthead{background-color:#d2d2d2;background-image:none}.account-masthead .account ul li{border-left:1px solid #a7a7a7}.account-masthead .account ul li a{color:#2f2f2f}.account-masthead .account ul li a:hover{color:rgba(255,255,255,.9);background-color:#0056ff}.masthead{background-color:#e8e8e8;background-image:none;height:auto}.masthead .navigation .nav-pills li a{margin:0;padding:15px;border-bottom:5px solid transparent;color:#000;font-weight:500}.masthead .navigation .nav-pills li a:hover{background-color:transparent;border-radius:0;border-bottom:5px solid rgba(0,86,255,.7);-webkit-box-shadow:none;box-shadow:none;color:rgba(0,0,0,.7)}.masthead .navigation .nav-pills li.active a{background-color:transparent;border-radius:0;border-bottom:5px solid #0056ff;-webkit-box-shadow:none;box-shadow:none;color:rgba(0,0,0,.7)}.masthead .site-search{float:right;margin-top:5px}.masthead .nav>li>a{color:rgba(255,255,255,.7)}.masthead #field-sitewide-search:focus{-webkit-box-shadow:inset 0 0 0 1px #0056ff;box-shadow:inset 0 0 0 1px #0056ff;border-color:#0056ff}.masthead input[type=text]{border-color:#ababab}.nav-tabs a .fa{display:inline}.nav-tabs a .fa:after{content:'';margin:0 3px 0 0}.btn{background-image:none;-webkit-box-shadow:none;box-shadow:none;border-radius:4px}.btn:hover{-webkit-box-shadow:none;box-shadow:none;background-color:#0047d4;color:#fff}.primary .btn .fa,.public-query .btn .fa,.secodary .btn .fa,.site-footer .btn .fa{display:inline}.primary .btn .fa:after,.public-query .btn .fa:after,.secodary .btn .fa:after,.site-footer .btn .fa:after{content:'';margin:0 3px 0 0}.btn-primary{background-color:#0056ff}.btn-primary:focus{background-color:#0056ff}.btn-primary:hover{background-color:#0047d4}.btn-secondary{background-color:#003499;border-color:#0056ff;color:#fff;text-shadow:none}.btn-secondary:focus,.btn-secondary:hover{color:#fff;background-color:#002b80}.btn-danger{background-color:#cf0000}.btn,label{font-weight:400}.btn-large .caret{margin-top:8px;margin-left:5px}.btn-download,.btn-download .btn-group{display:-webkit-box;display:-ms-flexbox;display:flex}.btn-download .btn,.btn-download .btn-group .btn{padding:20px}.btn-download .btn{padding-left:30px;padding-right:30px;font-weight:500;font-size:20px;font-family:inherit;border:transparent}.btn-update{font-size:20px;padding:20px;border-color:transparent;font-weight:500;font-family:inherit;border-radius:4px}.btn-filter-toggle.on{border-color:#51a351;background-color:#51a351}.btn-chart-download{cursor:pointer;float:right;z-index:10;color:#000;font-size:1em}.form-actions .btn{margin-left:10px}.btn-ordinary{background-color:#d2d2d2}.btn-ordinary:active,.btn-ordinary:focus,.btn-ordinary:hover{background-color:#e8e8e8;color:#000}.site-footer{background-color:#232323}.site-footer .container{padding-top:20px;padding-bottom:20px}.site-footer a{color:rgba(255,255,255,.7)}.site-footer .dropdown-toggle{color:#292929}.site-footer input[type=text]{border-color:#ccc}.site-footer,.site-footer label,.site-footer small{color:rgba(255,255,255,.7)}.uneditable-input,input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{border-radius:0}.dropdown-menu{border-radius:0}.search-form .search-input.search-giant button{margin-top:-15px}.search-giant .search:focus{-webkit-box-shadow:inset 0 0 0 2px #0056ff;box-shadow:inset 0 0 0 2px #0056ff;border-color:#0056ff}.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover{background:#0056ff}.dropdown-submenu:focus>a,.dropdown-submenu:hover>a{background:#0056ff}.control-checkbox-group input[type=checkbox]{top:0}.control-checkbox-group input[type=checkbox]:checked+label{font-weight:700;text-decoration:underline}.control-checkbox-group label{padding:0 5px;margin-left:5px;margin-bottom:0}.control-checkbox-group label:after{content:''}.query-item{border:1px solid #c4c4c4;padding:10px 20px;margin:10px 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.query-body{margin:0 20px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.query-body h2{margin-bottom:0}.query-actions{-ms-flex-negative:0;flex-shrink:0;margin-bottom:0}.filter_item{border-bottom:1px solid #dedede;border-radius:5px;margin:20px 0}.chart-actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;bottom:0;width:100%}.chart-actions.inline>li:last-child{padding-right:0}.visualization-fields-section{position:relative;border:1px solid #c4c4c4;padding:20px;margin-bottom:10px;background:#f7f7f7;display:-webkit-box;display:-ms-flexbox;display:flex}.preview-wrapper{background:#fff;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:1px solid #dedede}.map .item-content{min-width:100%;min-height:500px}.item-wrapper textarea{min-height:300px;max-width:100%}.item-wrapper .control-group.title{margin-bottom:0}.item-wrapper .control-group.title textarea{min-height:60px}.item-wrapper .control-group.title-vars{margin-bottom:0}.item-wrapper .control-group.title-vars select{color:gray}.item-wrapper .control-group.title-vars option[value=""][disabled]{display:none}.item-wrapper .control-group.title-vars option{color:#000}.item-wrapper .control-group.title-help .controls{padding:4px 10px;background-color:#ebebeb;border:solid 1px #ccc;font-size:11px}.item-wrapper .control-group.title-help a{color:#187794}.item-wrapper .control-group.title-help pre{word-break:normal}.item-wrapper .control-group.title-help .popover-content{word-break:normal}.chart-controls-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.tool-embed{color:#000!important}.related-query-item{margin-bottom:20px}.related-query-item .control-group{margin-bottom:0}.related-query-item .filter-actions{margin-right:20px;margin-bottom:0}.filter-actions{margin-right:20px}hr{border-top-color:#dedede}.c3-title{font-size:15px!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.c3-axis,.c3-chart-texts{font-size:12px!important}.c3-line{stroke-width:3px}.c3-grid text{fill:#000}.c3 .c3-ygrid-line.base{display:block}.c3 .c3-ygrid-line.active{display:none}.c3:hover .c3-ygrid-line.base{display:none}.c3:hover .c3-ygrid-line.active{display:block}.c3:hover .c3-ygrid-line.active text{font-size:125%;font-weight:700}.c3:hover .c3-ygrid-line.active line{stroke:#000}table.dataTable thead th{font-size:15px;background-color:#f5f5f5}table.dataTable tbody td{font-size:15px}.dt-header{font-size:22px}.dataTables_length{margin-right:10px}.dataTables_length>label>select{width:60px}.dataTables_filter>label>input{width:120px}.dt-buttons{margin-top:5px}.filter-color-picker{width:210px;border:1px solid #ccc;height:22px;padding:4px}@media (min-width:1200px){.wrap-btn-save-visualizations{z-index:99999;position:fixed;top:210px;right:44px;text-align:right}.wrap-btn-save-visualizations .btn.btn-success{margin:0}.public-query .item{position:relative;text-align:left;display:inline-block;float:left}.public-query .item.has-filter.size-sm .c3{max-height:126px}.public-query .item.has-filter.size-sm.square .c3{max-height:396px}.public-query .item.has-filter.size-md .c3{max-height:376px}.public-query .item.has-filter.size-md.vertical .c3{max-height:936px}.public-query .item.has-filter.size-lg .c3{max-height:376px}.public-query .item.has-filter.size-lg.square .c3{max-height:936px}.public-query .item.has-filter.size-lg.vertical .c3{max-height:936px}.public-query .item.size-sm{width:calc(31.8047619%);height:250px}.public-query .item.size-sm.double{width:calc(65.13809524%)}.public-query .item.size-sm.square{height:520px}.public-query .item.size-sm.vertical{height:1060px}.public-query .item.size-sm.wide{clear:both;width:calc(98.47142857%)}.public-query .item.size-md{width:calc(73.47142857%);height:520px}.public-query .item.size-md.vertical{height:1060px}.public-query .item.size-lg{width:calc(48.47142857%);height:520px}.public-query .item.size-lg.square{width:calc(65.13809524%);height:1060px}.public-query .item.size-lg.vertical{height:1060px}.public-query .item.size-xl{clear:both;width:calc(98.47142857%);height:520px}}@media (min-width:980px){.masthead{padding-top:10px}.masthead .nav-collapse{float:none}.masthead .navigation.default-menu{float:right}.preview-wrapper{margin-left:20px}}@media (max-width:1199px){.masthead .site-search input{width:10px}.masthead .site-search input::-webkit-input-placeholder{color:#fff}.masthead .site-search input::-moz-placeholder{color:#fff}.masthead .site-search input::-ms-input-placeholder{color:#fff}.masthead .site-search input::placeholder{color:#fff}.public-query .image img{width:100%;height:auto}}@media (min-width:768px){.visualization-fields-section{padding-left:60px}}@media (max-width:979px){.dataTables_wrapper .dataTables_filter,.dataTables_wrapper .dataTables_length,.dataTables_wrapper .dt-buttons{text-align:left;-ms-flex-preferred-size:100%;flex-basis:100%}.masthead .btn-navbar{background-color:#292929}.masthead .btn-navbar.active,.masthead .btn-navbar:focus,.masthead .btn-navbar:hover{background-color:#5c5c5c}.btn-navbar{margin:10px 0}.toolbar{margin-bottom:0}.toolbar .breadcrumb .home{display:inline-block}.masthead .navigation{float:none}.masthead .navigation .nav-pills{margin-bottom:20px}.public-query .container-chart{-webkit-box-flex:1;-ms-flex:auto;flex:auto}.size-lg.chart .item-content{height:500px!important}.public-query .item.chart{margin-right:0;padding-left:10px!important;padding-right:10px!important}.public-query .item{margin-left:0!important}.public-query .item-content.c3{min-height:460px}.public-query .c3-title{font-size:12px!important}.public-query .visualizations{padding-right:0!important}.c3-axis-y text{font-size:8px;font-weight:300}.c3-axis-x text{font-size:9px;font-weight:300}}@media (max-width:767px){.container-wrapper{background:0 0}}body{background-image:none;background-color:#fff}.map-info{padding:6px 8px;font:14px/16px Arial,Helvetica,sans-serif;background:#fff;background:rgba(255,255,255,.8);-webkit-box-shadow:0 0 15px rgba(0,0,0,.2);box-shadow:0 0 15px rgba(0,0,0,.2);border-radius:5px}.map-info h4{margin:0 0 5px;color:#777}.legend{font:14px/16px Arial,Helvetica,sans-serif;background:#fff;background:rgba(255,255,255,.8);-webkit-box-shadow:0 0 15px rgba(0,0,0,.2);box-shadow:0 0 15px rgba(0,0,0,.2);border-radius:5px;list-style:none}.legend span{width:16px;height:16px;float:left;margin-right:8px;border:1px solid #969696}.accordion-heading{background-color:#e8e8e8}.accordion-group{background-color:#fff}.accordion-toggle:after{font-family:FontAwesome;content:"\f078";float:right}.accordion-opened .accordion-toggle:after{content:"\f077"}.c3-axis-y text{font-size:11px;font-weight:800;font-family:'Open Sans',sans-serif;letter-spacing:-.2px}.c3-axis-x text{font-size:11px;font-weight:800;font-family:'Open Sans',sans-serif;letter-spacing:-.2px}.text-lowercase{text-transform:lowercase}.main,[role=main]{background:#fff;min-height:80vh}.box{border:0!important}.applicaitons-box{border-bottom:1px solid #bfbfbf;margin-bottom:20px}.applicaitons-box .thumb{display:inline-block;float:left}.applicaitons-box .content-box{float:left;width:80%;margin-left:15px}.applicaitons-box .content-box h2{margin-top:0}.applicaitons-box ul{margin:0;padding:0;margin-bottom:20px}.applicaitons-box ul li{display:inline}.query-item ul{margin:0;padding:0;margin-bottom:20px}.query-item ul li{padding:0;display:inline}.applicaitons-box:last-child{border-bottom:0}.group-list{list-style:none;padding:0;margin:0}.group-list-item{border-bottom:1px solid #bfbfbf;padding-bottom:20px;padding-top:10px}.group-image{width:100px;height:60px;float:left;text-align:center;margin-right:20px}.group-image img{max-width:100%!important;max-height:100%!important;margin:0 auto!important}.tool-title{margin:0 0 20px 0!important}.show-read-more .more-text{display:none}.group-image-2{width:100px;height:60px;margin-left:10px;padding-right:20px;float:none}.group-image-2 img{max-width:100%!important;max-height:100%!important;margin:0 auto!important}.query-btn{display:block;margin-top:20px}.wrapper{border:0}.wrapper .row1{margin-top:10px;margin-bottom:0}.wrapper .homepage-box{margin:0}.plotly .xtick{font-weight:700!important}.plotly .legend .scrollbox .groups .traces .layers .legendsymbols .legendpoints .pointtext{display:none!important}.imgBtn{margin-top:10px!important;padding:12px 15px!important;float:right!important}.textbox_desc{width:400px}.textbox_dropdown{width:415px}.textbox_info{width:393px!important}.line-row{padding-bottom:13px;border-bottom:1px solid #eee;margin-bottom:10px}.line-row select{width:150px}.line_type_label{width:120px}#chart_field_line_type_1_1,.custom_chart_select{margin-right:10px;width:120px}.line-width-type select{margin-right:10px;width:120px}.header-labels{text-align:right}.header-labels #lbl-1{text-align:left;width:128px;display:inline-block;margin-bottom:10px;font-weight:700}.header-labels #lbl-2{text-align:left;width:130px;display:inline-block;font-weight:700} \ No newline at end of file diff --git a/ckanext/querytool/fanstatic/javascript/dist/modules/viz-preview.js b/ckanext/querytool/fanstatic/javascript/dist/modules/viz-preview.js index eab81c20..64c77475 100644 --- a/ckanext/querytool/fanstatic/javascript/dist/modules/viz-preview.js +++ b/ckanext/querytool/fanstatic/javascript/dist/modules/viz-preview.js @@ -1579,6 +1579,7 @@ S = this.options.show_labels_as_percentages || !1, desc = !0 === this.options.description ? "" : this.options.description, line_types = this.options.line_types, + line_widths = this.options.line_widths, O = { bindto: this.el[0], /*color: { @@ -1876,12 +1877,32 @@ //type of line var lineTypes = this.options.line_types + var lineWidths = this.options.line_widths + if (lineTypes.length > 0) { var lineTypesList = this.options.line_types.split(',') } else { var lineTypesList = this.options.line_types } + if (lineWidths.length > 0) { + var lineWidthsList = this.options.line_widths.split(',') + } else { + var lineWidthsList = String(this.options.line_widths) + } + + if (typeof lineWidths == 'number') { + lineWidths = String(lineWidths) + } + + function setDefaultWidth(width) { + if ([undefined, '0', ''].includes(width)) { + return '4' + } else { + return width + } + } + // if typeof plotly is string -> new chart // if typeof plotly is object -> existing chart (user view or admin preview) // if plotly value is true we may have some data in the database for the chart, but plotly is set to true @@ -1896,6 +1917,7 @@ } var tmp ; + for (tmp=0; tmp < columns.length - 1; tmp++){ var name = columns[tmp][0]; @@ -1914,7 +1936,7 @@ size: 14, }, name: name, - line: {width: 4, dash: lineTypesList[tmp]}, + line: {width: setDefaultWidth(lineWidthsList[tmp]), dash: lineTypesList[tmp]}, hovertemplate: '%{y}', error_y: {}, error_x: {} @@ -1938,7 +1960,7 @@ size: 14, }, type: 'scatter', - line: {width: 4, dash: lineTypes}, + line: {width: setDefaultWidth(lineWidths), dash: lineTypes}, error_y: {}, error_x: {} }; @@ -2099,7 +2121,7 @@ width: 3, line: { shape: 'spline', - width: 4, + width: setDefaultWidth(lineWidthsList[tmp]), dash: lineTypesList[tmp] } @@ -2126,7 +2148,7 @@ name: 'Color', line: { shape: 'spline', - width: 4, + width: setDefaultWidth(lineWidths), dash: lineTypes } }; @@ -2316,7 +2338,7 @@ size: 14, }, line: { - dash: lineTypesList[tmp] + width: 4 }, type: 'scatter', name: name, @@ -2340,7 +2362,7 @@ size: 14, }, line: { - dash: lineTypes + width: 4 }, name: columns[0][0], type: 'scatter', @@ -2368,6 +2390,7 @@ //console.log(d); var c = "chart_field_line_type_"+ item_no + "_" + (tmp+1) + var lw = "chart_field_line_width_"+ item_no + "_" + (tmp+1) var chart_field_plotly_value = chart_plotly.value; /* @@ -2413,7 +2436,9 @@ // delete elements var p = document.querySelectorAll('[id^="chart_field_line_type_'+item_no+'"]'); + var lwSel = document.querySelectorAll('[id^="chart_field_line_width_'+item_no+'"]'); var ltype_elements = 0; + var lwidth_elements = 0; for (var a = 0; a < p.length; a++) { var type = p[a].tagName; @@ -2431,13 +2456,33 @@ } } + for (var a = 0; a < lwSel.length; a++) { + var type = lwSel[a].tagName; + if (type === 'SELECT') { + lwidth_elements = lwidth_elements + 1; + } + } + + if (lwidth_elements > data.length) { + for (var a = 0; a < lwSel.length; a++) { + var type = lwSel[a].tagName; + if (type === 'SELECT') { + lwSel[a].parentElement.remove(); + } + } + } // add new html element + var html_line_type = 'solid' + var html_line_width = '4' - if (d.line && d.line.dash) { - var html_line_type = d.line.dash - } else { - var html_line_type = 'solid' + if (d.line) { + if (d.line.dash) { + html_line_type = d.line.dash + } + if (d.line.width) { + html_line_width = String(d.line.width) + } } var elementExists = document.getElementById(c); @@ -2447,8 +2492,8 @@ var newcontent = document.createElement('div'); var html = ''; html += '
' - html += '' - html += ''; if (html_line_type == 'solid') { html += ''; @@ -2475,6 +2520,30 @@ } html += ''; + + //Line width + html += ''; + html += '
' newcontent.innerHTML = html @@ -2517,6 +2586,30 @@ } html += ''; + + //Line width + html += ''; + html += '' newcontent.innerHTML = html; @@ -3313,6 +3406,8 @@ bar_width = t.find("input[name*=chart_field_bar_width_]").val(), donut_hole = t.find("input[name*=chart_field_donut_hole_]").val(), ltypes_list = t.find(`[name*=chart_field_line_type_]`), + lwidths_list = t.find(`[name*=chart_field_line_width_]`), + lwidths = [], ltypes = []; for (let i = 0; i < ltypes_list.length; i++) { @@ -3330,8 +3425,12 @@ console.error(error) } - if (this.fetched_data && this.options.x_axis === o && this.options.y_axis === a && this.options.filter_name === m && this.options.filter_value === g && this.options.category_name === x && this.options.chart_type === e && this.options.static_reference_columns === k && this.options.dynamic_reference_type === N && this.options.dynamic_reference_factor === P && this.options.plotly === plotly && this.options.bar_width === bar_width && this.options.donut_hole === donut_hole) return this.options.colors = n, this.options.seq_color = nn, this.options.color_type = nnn, this.options.chart_type = e, this.options.title = s, this.options.show_legend = c, this.options.show_annotations = sa, this.options.show_bounds = bnds, this.options.x_text_rotate = u, this.options.x_text_multiline = l, this.options.x_tick_culling_max = f, this.options.tooltip_name = p, this.options.data_format = h, this.options.y_tick_format = _, this.options.x_tick_format = xf, this.options.chart_padding_left = i, this.options.chart_padding_bottom = r, this.options.padding_top = d, this.options.padding_bottom = v, this.options.show_labels = S, this.options.y_label = O, this.options.y_label_hide = w, this.options.x_label = xl, this.options.x_label_hide = xlh, this.options.y_from_zero = E, this.options.axis_range = yp, this.options.x_from_zero, this.options.tick_count = y, this.options.data_sort = b, this.options.upper_bounds = ub, this.options.lower_bounds = lb, this.options.axis_min = amin, this.options.axis_max = amax, this.options.static_reference_columns = k, this.options.static_reference_label = j, this.options.dynamic_reference_type = N, this.options.dynamic_reference_factor = P, this.options.dynamic_reference_label = F, this.options.measure_label = M, this.options.show_labels_as_percentages = I, this.options.plotly = plotly, this.options.bar_width = bar_width, this.options.donut_hole = donut_hole, this.options.line_types = ltypes.join(), void this.createChart(this.fetched_data); - this.options.colors = n, this.options.seq_color = nn, this.options.color_type = nnn, this.options.chart_type = e, this.options.x_axis = o, this.options.y_axis = a, this.options.title = s, this.options.show_legend = c, this.options.show_annotations = sa, this.options.show_bounds = bnds, this.options.x_text_rotate = u, this.options.x_text_multiline = l, this.options.x_tick_culling_max = f, this.options.tooltip_name = p, this.options.data_format = h, this.options.y_tick_format = _, this.options.x_tick_format = xf, this.options.chart_padding_left = i, this.options.chart_padding_bottom = r, this.options.padding_top = d, this.options.padding_bottom = v, this.options.show_labels = S, this.options.tick_count = y, this.options.y_label = O, this.options.y_label_hide = w, this.options.x_label = xl, this.options.x_label_hide = xlh, this.options.y_from_zero = E, this.options.axis_range = yp, this.options.x_from_zero, this.options.filter_name = m, this.options.filter_value = g, this.options.category_name = x, this.options.data_sort = b, this.options.upper_bounds = ub, this.options.lower_bounds = lb, this.options.axis_min = amin, this.options.axis_max = amax, this.options.static_reference_columns = k, this.options.static_reference_label = j, this.options.dynamic_reference_type = N, this.options.dynamic_reference_factor = P, this.options.dynamic_reference_label = F, this.options.measure_label = M, this.options.show_labels_as_percentages = I, this.options.plotly = plotly, this.options.bar_width = bar_width, this.options.donut_hole = donut_hole, this.options.line_types = ltypes.join(); + for (let i = 0; i < lwidths_list.length; i++) { + lwidths.push(String(t.find(`[name=${lwidths_list[i].id}]`).val())) + } + + if (this.fetched_data && this.options.x_axis === o && this.options.y_axis === a && this.options.filter_name === m && this.options.filter_value === g && this.options.category_name === x && this.options.chart_type === e && this.options.static_reference_columns === k && this.options.dynamic_reference_type === N && this.options.dynamic_reference_factor === P && this.options.plotly === plotly && this.options.bar_width === bar_width && this.options.donut_hole === donut_hole) return this.options.colors = n, this.options.seq_color = nn, this.options.color_type = nnn, this.options.chart_type = e, this.options.title = s, this.options.show_legend = c, this.options.show_annotations = sa, this.options.show_bounds = bnds, this.options.x_text_rotate = u, this.options.x_text_multiline = l, this.options.x_tick_culling_max = f, this.options.tooltip_name = p, this.options.data_format = h, this.options.y_tick_format = _, this.options.x_tick_format = xf, this.options.chart_padding_left = i, this.options.chart_padding_bottom = r, this.options.padding_top = d, this.options.padding_bottom = v, this.options.show_labels = S, this.options.y_label = O, this.options.y_label_hide = w, this.options.x_label = xl, this.options.x_label_hide = xlh, this.options.y_from_zero = E, this.options.axis_range = yp, this.options.x_from_zero, this.options.tick_count = y, this.options.data_sort = b, this.options.upper_bounds = ub, this.options.lower_bounds = lb, this.options.axis_min = amin, this.options.axis_max = amax, this.options.static_reference_columns = k, this.options.static_reference_label = j, this.options.dynamic_reference_type = N, this.options.dynamic_reference_factor = P, this.options.dynamic_reference_label = F, this.options.measure_label = M, this.options.show_labels_as_percentages = I, this.options.plotly = plotly, this.options.bar_width = bar_width, this.options.donut_hole = donut_hole, this.options.line_types = ltypes.join(), this.options.line_widths = lwidths.join(), void this.createChart(this.fetched_data); + this.options.colors = n, this.options.seq_color = nn, this.options.color_type = nnn, this.options.chart_type = e, this.options.x_axis = o, this.options.y_axis = a, this.options.title = s, this.options.show_legend = c, this.options.show_annotations = sa, this.options.show_bounds = bnds, this.options.x_text_rotate = u, this.options.x_text_multiline = l, this.options.x_tick_culling_max = f, this.options.tooltip_name = p, this.options.data_format = h, this.options.y_tick_format = _, this.options.x_tick_format = xf, this.options.chart_padding_left = i, this.options.chart_padding_bottom = r, this.options.padding_top = d, this.options.padding_bottom = v, this.options.show_labels = S, this.options.tick_count = y, this.options.y_label = O, this.options.y_label_hide = w, this.options.x_label = xl, this.options.x_label_hide = xlh, this.options.y_from_zero = E, this.options.axis_range = yp, this.options.x_from_zero, this.options.filter_name = m, this.options.filter_value = g, this.options.category_name = x, this.options.data_sort = b, this.options.upper_bounds = ub, this.options.lower_bounds = lb, this.options.axis_min = amin, this.options.axis_max = amax, this.options.static_reference_columns = k, this.options.static_reference_label = j, this.options.dynamic_reference_type = N, this.options.dynamic_reference_factor = P, this.options.dynamic_reference_label = F, this.options.measure_label = M, this.options.show_labels_as_percentages = I, this.options.plotly = plotly, this.options.bar_width = bar_width, this.options.donut_hole = donut_hole, this.options.line_types = ltypes.join(), this.options.line_widths = lwidths.join(); if (bar_width != ''){ this.options.bar_width = parseFloat(bar_width) / 10 diff --git a/ckanext/querytool/fanstatic/javascript/dist/visualizations_settings.js b/ckanext/querytool/fanstatic/javascript/dist/visualizations_settings.js index 247b93d0..acb0e70d 100644 --- a/ckanext/querytool/fanstatic/javascript/dist/visualizations_settings.js +++ b/ckanext/querytool/fanstatic/javascript/dist/visualizations_settings.js @@ -1501,7 +1501,10 @@ bar_width = e.find("[id*=chart_field_bar_width_]"), ltypetarget = e.find("[data-target*=chart_field_line_type_]"), ltypes = e.find("[id*=chart_field_line_type_]"), - ltypes_label = e.find("label[for*=chart_field_line_type_]"); + ltypes_label = e.find("label[for*=chart_field_line_type_]"), + lwidthtarget = e.find("[data-target*=chart_field_line_width_]"), + lwidths = e.find("[id*=chart_field_line_width_]"); + console.log('IN VIZ SETTINGS') @@ -1535,6 +1538,16 @@ ltypes.attr("name", "chart_field_line_type_" + i+"_1") } + if(lwidths['length'] > 1) { + for(var x = 0; x < lwidths['length']; x++){ + lwidths[x].setAttribute("id", "chart_field_line_width_" + i+"_"+(x + 1)) + lwidths[x].setAttribute("name", "chart_field_line_width_" + i+"_"+(x + 1)) + } + } else { + lwidths.attr("id", "chart_field_line_width_" + i+"_1") + lwidths.attr("name", "chart_field_line_width_" + i+"_1") + } + e.attr("id", "chart_field_" + i), r.attr("id", "chart_field_graph_" + i), r.attr("name", "chart_field_graph_" + i), nn.attr("id", "chart_field_seq_color_" + i), nn.attr("name", "chart_field_seq_color_" + i), dtr.attr("data-target", "chart_field_seq_color_" + i), nn.attr("for", "chart_field_seq_color_" + i), nnn.attr("id", "chart_field_color_type_" + i), nnn.attr("name", "chart_field_color_type_" + i), nnnn.attr("class", "chart_field_color_wrap_" + i), sq.attr("class", "seq-colors-" + i), dv.attr("class", "diver-colors-" + i), sa.attr("id", "chart_field_show_annotations_" + i), sa.attr("name", "chart_field_show_annotations_" + i), a.attr("id", "chart_field_axis_y_" + i), a.attr("name", "chart_field_axis_y_" + i), o.attr("id", "chart_field_axis_x_" + i), o.attr("name", "chart_field_axis_x_" + i), l.attr("id", "chart_field_title_" + i), l.attr("name", "chart_field_title_" + i), _.attr("id", "chart_field_x_text_rotate_" + i), _.attr("name", "chart_field_x_text_rotate_" + i), c.attr("id", "chart_field_labels_" + i), c.attr("name", "chart_field_labels_" + i), d.attr("id", "chart_field_legend_" + i), d.attr("name", "chart_field_legend_" + i), f.attr("id", "chart_field_show_labels_as_percentages_" + i), f.attr("name", "chart_field_show_labels_as_percentages_" + i), u.attr("id", "chart_field_tooltip_name_" + i), u.attr("name", "chart_field_tooltip_name_" + i), s.attr("id", "chart_field_data_format_" + i), s.attr("name", "chart_field_data_format_" + i), p.attr("id", "chart_field_y_ticks_format_" + i), p.attr("name", "chart_field_y_ticks_format_" + i), xf.attr("id", "chart_field_x_ticks_format_" + i), xf.attr("name", "chart_field_x_ticks_format_" + i), h.attr("id", "chart_field_y_label_" + i), h.attr("name", "chart_field_y_label_" + i), m.attr("id", "chart_field_y_label_hide_" + i), m.attr("name", "chart_field_y_label_hide_" + i), xl.attr("id", "chart_field_x_label_" + i), xl.attr("name", "chart_field_x_label_" + i), xlh.attr("id", "chart_field_x_label_hide_" + i), xlh.attr("name", "chart_field_x_label_hide_" + i), v.attr("id", "chart_field_y_from_zero_" + i), v.attr("name", "chart_field_y_from_zero_" + i), xfz.attr("id", "chart_field_x_from_zero_" + i), xfz.attr("name", "chart_field_x_from_zero_" + i), g.attr("id", "chart_field_padding_top_" + i), g.attr("name", "chart_field_padding_top_" + i), y.attr("id", "chart_field_padding_bottom_" + i), y.attr("name", "chart_field_padding_bottom_" + i), xx.attr("id", "chart_field_size_" + i), xx.attr("name", "chart_field_size_" + i), S.attr("id", "chart_field_filter_name_" + i), S.attr("name", "chart_field_filter_name_" + i), b.attr("id", "chart_field_tick_count_" + i), b.attr("name", "chart_field_tick_count_" + i), O.attr("id", "chart_field_filter_value_" + i), O.attr("name", "chart_field_filter_value_" + i), w.attr("id", "chart_div_filter_value_" + i), k.attr("id", "chart_field_filter_alias_" + i), k.attr("name", "chart_field_filter_alias_" + i), j.attr("id", "chart_div_filter_alias_" + i), E.attr("id", "chart_field_filter_visibility_" + i), E.attr("name", "chart_field_filter_visibility_" + i), P.attr("id", "chart_div_filter_visibility_" + i), T.attr("id", "chart_field_static_reference_columns_" + i), T.attr("name", "chart_field_static_reference_columns_" + i), C.attr("id", "chart_field_static_reference_label_" + i), C.attr("name", "chart_field_static_reference_label_" + i), z.attr("id", "chart_field_dynamic_reference_type_" + i), z.attr("name", "chart_field_dynamic_reference_type_" + i), A.attr("id", "chart_field_dynamic_reference_factor_" + i), A.attr("name", "chart_field_dynamic_reference_factor_" + i), I.attr("id", "chart_field_dynamic_reference_label_" + i), I.attr("name", "chart_field_dynamic_reference_label_" + i), q.attr("id", "resource_id_" + i), q.attr("name", "resource_id_" + i), N.attr("id", "chart_field_category_name_" + i), N.attr("name", "chart_field_category_name_" + i), D.attr("id", "chart_field_sort_" + i), D.attr("name", "chart_field_sort_" + i), V.attr("id", "chart_field_sort_div_" + i), M.attr("id", "chart_field_chart_padding_left_" + i), M.attr("name", "chart_field_chart_padding_left_" + i), L.attr("id", "chart_field_chart_padding_bottom_" + i), L.attr("name", "chart_field_chart_padding_bottom_" + i), R.attr("id", "chart_field_x_text_multiline_" + i), R.attr("name", "chart_field_x_text_multiline_" + i), F.attr("id", "chart_field_x_tick_culling_max_" + i), F.attr("name", "chart_field_x_tick_culling_max_" + i), plotly.attr("id", "chart_field_plotly_" + i), plotly.attr("name", "chart_field_plotly_" + i), lplotly.attr("id", "chart_field_plotly_line_" + i), lplotly.attr("name", "chart_field_plotly_line_" + i), plotly_label.attr("id", "chart_field_plotly_label_" + i), plotly_label.attr("name", "chart_field_plotly_label_" + i), donut_hole.attr("id", "chart_field_donut_hole_" + i), donut_hole.attr("name", "chart_field_donut_hole_" + i), bar_width.attr("id", "chart_field_bar_width_" + i), bar_width.attr("name", "chart_field_bar_width_" + i) diff --git a/ckanext/querytool/fanstatic/javascript/vitals.js b/ckanext/querytool/fanstatic/javascript/vitals.js index d2c1ad9c..42ef33e2 100644 --- a/ckanext/querytool/fanstatic/javascript/vitals.js +++ b/ckanext/querytool/fanstatic/javascript/vitals.js @@ -746,7 +746,7 @@ $(document).ready(function(){ $(this).closest('.accordion').find(".color-accordion").removeClass('hidden') } - if(['line', 'area', 'spline'].includes(selected)) { + if(['line', 'spline'].includes(selected)) { $(this).closest('.accordion').find(".line-accordion").removeClass('hidden') } else { $(this).closest('.accordion').find(".line-accordion").addClass('hidden') diff --git a/ckanext/querytool/fanstatic/less/main.less b/ckanext/querytool/fanstatic/less/main.less index 2503d35d..37e9cc9e 100644 --- a/ckanext/querytool/fanstatic/less/main.less +++ b/ckanext/querytool/fanstatic/less/main.less @@ -252,3 +252,36 @@ body { margin-bottom: 10px; } +.line_type_label { + width:120px; +} + +.custom_chart_select, #chart_field_line_type_1_1 { + margin-right:10px; + width:120px; +} + + +.line-width-type select { + margin-right:10px; + width:120px; +} + +.header-labels { + text-align: right; + + #lbl-1 { + text-align: left; + width: 128px; + display: inline-block; + margin-bottom: 10px; + font-weight: bold; + } + + #lbl-2 { + text-align: left; + width: 130px; + display: inline-block; + font-weight: bold; + } + } \ No newline at end of file diff --git a/ckanext/querytool/templates/ajax_snippets/chart_item.html b/ckanext/querytool/templates/ajax_snippets/chart_item.html index 28956b66..15bb4d3c 100644 --- a/ckanext/querytool/templates/ajax_snippets/chart_item.html +++ b/ckanext/querytool/templates/ajax_snippets/chart_item.html @@ -159,7 +159,7 @@ {# Line Chart additional setup #} - {% if selected_chart_type in ['line', 'spline', 'area'] %} + {% if selected_chart_type in ['line', 'spline'] %} {% set hide_line_options = '' %} {% else %} {% set hide_line_options = 'hidden' %} @@ -179,16 +179,27 @@
-
+
+ +
+ + +
{% set line_types = '' %} {% set line_types_selection = [] %} + {% set line_widths = '' %} + {% set line_widths_selection = [] %} {% if chart %} {% if chart.line_types %} {% set line_types = chart.line_types %} {% set line_types_selection = chart.line_types.split(',') %} {% endif %} + {% if chart.line_widths %} + {% set line_widths = chart.line_widths %} + {% set line_widths_selection = chart.line_widths.split(',') %} + {% endif %} {% else %}

Select and update data to list lines.

{% endif %} @@ -202,14 +213,20 @@ {% set line_type_title = 'Line Type' %} {% endif %} -
- - + + +
{% set line_count = line_count + 1 %} @@ -1025,6 +1042,7 @@ {% set axis_min = chart.axis_min %} {% set axis_max = chart.axis_max %} {% set line_types = chart.line_types %} + {% set line_widths = chart.line_widths %} {% endif %} {% snippet 'ajax_snippets/visualization_item.html', type='chart', @@ -1079,7 +1097,8 @@ axis_range = axis_range, axis_min = axis_min, axis_max = axis_max, - line_types = line_types + line_types = line_types, + line_widths = line_widths %}
diff --git a/ckanext/querytool/templates/ajax_snippets/visualization_item.html b/ckanext/querytool/templates/ajax_snippets/visualization_item.html index 53bafceb..f0bc2837 100644 --- a/ckanext/querytool/templates/ajax_snippets/visualization_item.html +++ b/ckanext/querytool/templates/ajax_snippets/visualization_item.html @@ -54,5 +54,6 @@ data-module-axis_min="{{ axis_min }}" data-module-axis_max="{{ axis_max }}" data-module-line_types="{{ line_types }}" + data-module-line_widths="{{ line_widths }}" >
\ No newline at end of file diff --git a/ckanext/querytool/templates/querytool/public/read.html b/ckanext/querytool/templates/querytool/public/read.html index 38327dca..773c8392 100644 --- a/ckanext/querytool/templates/querytool/public/read.html +++ b/ckanext/querytool/templates/querytool/public/read.html @@ -285,7 +285,8 @@