Giter Club home page Giter Club logo

cmv-widgets's Introduction

CMV Widgets

Join the chat at https://gitter.im/roemhildtg/CMV_Widgets

Dojo Widgets to extend the functionality of the Esri Javascript API and CMV. Documentation on how to use these widgets can be found in their respective folder. While designed to work specifically for CMV, they should function just as well outside of CMV in a different Dojo or Esri API app.

Demo

  • Check out the demo for a fully functional demo.
  • View the source code in the gh-pages branch.

AppSettings

URL Field

Filter

URL Field

RelatedRecordsTable

URL Field

MetadataDialog

URL Field

HeatMap Layer

URL Field

Label Layer Creator

widgets/LabelLayer/docs/label.png

TimeSlider

URL Field

LoginCookie

cmv-widgets's People

Contributors

cmosnick avatar duckblaster avatar friendde avatar gitter-badger avatar gonoles avatar green3g avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

cmv-widgets's Issues

Time Slider change

Hi, @roemhildtg

Thanks for the time slider widget code. Here is a change i want to make, the reason is i have other widget that use the same bottom pane (export, search, etc). So i am thinking to change your code a little bit, but no luck so far. Could you please take a look at the following to see what else i am missing?

Basically, instead of set the div in the viewer.js setting part, I put it in the code, see the section

//////////////////////

//////////////////////

Thanks

define([
'dojo/_base/declare',
'dijit/_WidgetBase',
'dojo/_base/lang',
'dojo/_base/array',
'esri/TimeExtent',
'esri/dijit/TimeSlider',
'dijit/_Container',
'dojo/query',
'dijit/registry',
'dojo/topic',
'dijit/layout/ContentPane'
], function(declare, _WidgetBase, lang, array, TimeExtent, TimeSlider, _Container, query, registry, topic, ContentPane) {
var pane;
return declare([_WidgetBase, _Container], {
map: null,
startTime: new Date('1/1/1921'),
endTime: new Date('12/31/2016'),
timeSlider: null,
timeExtent: null,
timeInterval: 2,
timeIntervalUnits: 'esriTimeUnitsYears',
timeSliderProperties: {},
postCreate: function() {
this.inherited(arguments);
if(!this.map){
return false;
}
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
if (!pane)
{
var tabsid = query(".attributesTabContainer")[0].id;
var tabs = registry.byId(tabsid);

            pane = new ContentPane({ title: "Time Slider", content: '<div id="timeSlider" style="height:100%;"></div>' });            
            tabs.addChild(pane);
            tabs.selectChild(pane);    
        }

        //open the bottom pane
        topic.publish('viewer/togglePane', {
            pane: 'bottom',
            show: 'block'
        });      

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
this.timeSlider = new TimeSlider(lang.mixin({
style: 'width:100%;'
}, this.timeSliderProperties));
this.map.setTimeSlider(this.timeSlider);
this.timeExtent = lang.mixin(new TimeExtent(), {
startTime: this.startTime,
endTime: this.endTime
});
this.timeSlider.setThumbCount(2);
this.timeSlider.createTimeStopsByTimeInterval(
this.timeExtent,
this.timeInterval,
this.timeIntervalUnits
);
this.timeSlider.setThumbIndexes([0,1]);
this.timeSlider.setThumbMovingRate(2000);
this.addChild(this.timeSlider);
},
startup: function() {
this.inherited(arguments);
this.timeSlider.startup();
this.setLabels();
},
setLabels: function() {
//add labels for every other time stop
var labels = array.map(this.timeSlider.timeStops, function(timeStop, i) {
if ( i % 2 === 0 ) {
return timeStop.getUTCFullYear();
} else {
return "";
}
});
this.timeSlider.setLabels(labels);

    }
});

});

basemap in appsetting

hi,
i am using your fantastic appsetting widget in my app. it is great, thank you!
i tried to add basemap as a parameter to the widget but couldn't. i would appreciate it if you could give me a hint.
thanks

Time Slider

I was hoping you could provide me with some direction. I am not able to get TimeSlider to show, nothing comes up when I grunt the app.

  1. Created a folder called TimeSlider under dijit folder, added TimeSlider.js into that folder.
  2. Added Time Aware Layer to app.
  3. viewer.js - Added this code.
bottom: {
                id: 'sidebarBottom',
                placeAt: 'outer',
                splitter: true,
                collapsible: true,
                region: 'bottom',
                style: 'height:300px;display:block;',
                content: '<div id="timeSlider" style="height:100%;"></div>'
            },
            timeSlider: {
                include: true,
                id: 'timeSlider',
                type: 'domNode',
                srcNodeRef: 'timeSlider',
                path: 'gis/dijit/TimeSlider',
                title: 'Time Slider',
                options: {
                    map: true,
                    startTime: new Date('1/1/2001'),
                    endTime: new Date('1/1/2015'),
                    timeInterval: 1,
                    timeIntervalUnits: 'esriTimeUnitsYears'
                }
            }

AppSettings Widget just opens a new map

Hi,

I have been trying to get the AppSettings widget working with the end goal of allowing my end users to have a way to open there map up on a new terminal and continue where they left off, this includes basemap selected, map extent and graphics drawn with the draw widget. I was hoping your widget would allow me to do this or at least be a good starting point, however all it seems to do at the moment is show the "Share Map" popup and then proceed to open a new map when you click "Share This Map".

Obviously I'm missing something as the map that it opens is a blank map without any of the users settings saved.

Any help you could provide would be greatly appreciated.

problem with appsetting widget

hi there and thanks for sharing your codes.
i cannot get the AppSetting widget to work in my app (which runs locally). i want to use it in a url and the widget populates it but opening that url has no effect on visibility of layers or map extents and ...
i even tried to run your demo version locally but i have the same problem.

Label Widget field list gets appended to

Hi, I'm noticing on the label widget, after choosing to label a field on a certain layer, then choosing a different layer, the field list contains the fields of the first layer and the second. Just wondering if this has been noticed before and if i'm doing something wrong in the config.
Heres my current config:

            labelLayer: {
                title: 'Map Labels',
                id: 'labelLayer',
                include: true,
                type: 'titlePane', //titlePane
                position: 15,
                path: 'gis/dijit/Widgets/LabelLayer',
                options: {
                    // required!
                    map: true,
                    layerControlLayerInfos: true,
                    labelInfos: {
                      private: { // a string like 'assets'
                        exclude: true  //, // exclude this entire layer
                      },
                      BasemapLabels:{
                        exclude:false, 
                        4:{
                            exclude: false, 
                            fields:[{
                                alias: 'PIN',
                                name: 'PIN'
                            },{
                                alias: 'LASTNAME',
                                name: 'LASTNAME'
                            },{
                                alias: 'LOT',
                                name:'LOT'
                            }]
                        },
                        3:{
                            exclude: true
                        },
                        2: {
                            exclude: true
                        },
                        0: {
                            exclude: true
                        },
                        1: {
                            exclude: false
                        },
                        5: {
                            exclude: false
                        }
                      },
                      conservation: {
                          exclude: true
                      },
                      gps: {
                          exclude:true
                      },
                      regionalgeography: {
                          exclude:true
                      },
                      boundaries: {
                          exclude: true
                      },
                      parcels: {
                          exclude: true
                      },
                      distribution: {
                          exclude:true
                      }
                      
                    }
                }
            }  

BTW this is a great widget, i see it being super useful to our users! Thanks!

AppSettings template not loading

@roemhildtg I am trying to implement your AppSettings widget to allow email links to specific extents within my CMV application.

I have loaded it "off-the-shelf" from your github repo, but I'm getting a strange error when I open my application. The widget TitlePane is loading on the left of my app, but expanding the TitlePane reveals that it's empty.

Any ideas? Thanks!

Here's what's coming up in the console:

Uncaught TypeError: Cannot read property 'ownerDocument' of null
b.place @   init.js:158
declare._handleShare    @   _shareMixin.js:30
declare._init   @   AppSettings.js:73
declare._loadAppSettings    @   AppSettings.js:142
declare.postCreate  @   AppSettings.js:68
z.create    @   _WidgetBase.js:6
z.postscript    @   _WidgetBase.js:4
(anonymous function)    @   init.js:108
createWidget    @   Controller.js:529
g._hitchArgs    @   init.js:176
ha  @   init.js:32
(anonymous function)    @   init.js:33
ia  @   init.js:33
fa  @   init.js:33
g   @   init.js:35
(anonymous function)    @   init.js:40

Here's the relevant excerpt from viewer.js:

settings: {
    include: true,
    id: 'settings',
    position: 10,
    type: 'titlePane',
    path: 'gis/dijit/AppSettings',
    title: 'Save/Share Current Map',
    options: {
        //required:
         map: true,
         layerControlLayerInfos: true,
         //optional: 
         appSettings: {},
         parametername: 'cmvSettings',
         mapRightClickMenu: true,
         address: '[email protected]',
         subject: 'Share Map',
         body: 'Check out this map! <br /> ',
         emailSettings: ['saveMapExtent', 'savelayerVisibility'],
         shareNode: ''
         //shareTemplate: ''
    }
}

Appsetting can't save visible layer

Hi, I am new to Javascript and CMV.
Thanks for sharing your code, I am able to add the appsetting widget to save extent but can't display visible layer.
Below is the error I got when copy the URL to a new browser.

TypeError: layer.layer.setVisibleLayers is not a function(โ€ฆ)(anonymous function) @ init.js:31

Any thoughts on what could cause the error?

Thanks,
Shen

Troubleshooting label widget

Moved from cmv/cmv-app#642 (comment)

@roemhildtg We're giving it a try in a copy of our editor. Looks good for a long time, but ultimately doesn't label. We keep getting an error , maybe one of those still existing bugs you mention. Maybe analyzing the error in the app helps to see what's happening: https://www.hgis-indias.net/cmv-app-master/label/

Anyway, please keep me updated, this seems to be really useful for us, probably not for all layers, but for the "aggregated data" ones, where I can imagine people would want to use different values as labels and there's no need to label more than one of them.

App Settings custom widget

Hi,

I'm having problems getting the App Settings widget to work. The widget is appearing in the side pane but it is not populated by the form items (see image). I've added the settings information to viewer.js and AppSettings.js to gis/dijit, as well as the AppSettings/templates/AppSettings.html folder. I can't see what's wrong with this.

Any help appreciated.

Thanks,
Stephen

app settings

Problem with labellayer

Hi. Thank you for this great widget. I would be really greatful if you could help me with this issue, I have added label layer to my app ad it seems to work fine because a new layer is created and added to my layers but it has no label.

Related Record issue maybe

Great Widget.

Got one problem here, if i use the widget in the identify manner, it generally works fine, but if my identify return two or more records at one time, then that next button seems does not refresh the data correctly. Please see if you have the same problem or not.

Thanks!

Limit features available to filter widget

Just wondering if there is a way to limit the features that appear in the filter widget? At the moment it shows all layers when I only want the user to see certain ones

Reset timeslider on close

It would be useful to have the timeslider reset the temporal extents when the timeslider widget it is closed so that all data date ranges are shown.

Demo branch not available

Hi, I'm new with all this. I find your widget is interesting to explore but there is not enough sample for me to follow.

I see you mentioned there is a DEMO BRANCH. Unfortunately i got error 404 when I follow the link.

Help is very much appreciated

Thanks

Guidance for related records widget

Do you have more detailed guidance other than the readme for this widget? I'm not able to implement this with CMV version 1.2 or 1.3. I'm sure I'm just doing something wrong, but I can't pinpoint it. If you don't have more detailed guidance available, is there any chance you could share files from a working example? Thanks!

AppSetting widget in CMV develop version

Hi, @roemhildtg

Have you tried the appSetting widget in the CMV develop version? It seems to me i cannot click any of the checkbox

image

it has no error, but when look more into it, seems in file AppSetting.js

this function is never called

this.loadAppSettings();

Please see if you know some of the hint to resolve this.

Thanks

Layout issues

I am having problems getting this widget to work. The issue is purely related to display, the retrieval of relationships and related records works great!

I suspect that I'm having similar issues to those described here:
cmv/cmv-app#233

What I can tell from my testing is that for one thing, the only tab position that works is 'left-h'. If I use anything other, the tabcontainer and grid are not displayed. Actually they are displayed but the contentPane the widget is placed in has a height of 0.

If I use the default 'left-h' tab position, then the tab is displayed but the grid is not. It's in the dom but has it's container height is 0. If I click on the pane splitter, do not need to drag, just the click is sufficient, then it causes the widget to redraw and everything looks fine.

Any ideas on how to get this working?

Thanks!

Trying to embed Related tables widget into identify info window

I've been trying to get the related table widget to work within the identify info window with out any luck. I've updated to the latest version, and tried adding in the suggested code. Doing this disables the identify pop up all together. Any suggestions?

Saving and retrieving settings

I am having a little trouble figuring out where to place the "Topic.Publish" and "Topic.Subscribe" statements. I have tried a couple different places in the Appsettings.js but I seem to be messing up the logic. Sorry, more of a question than an issue but it is driving me crazy and I'd love to incorporate it into my app.

Heatmap for the Filtered features

Hi,I'm new to this. I am trying to customize the CMV based on my requirements. I found that Heatmap widget helps to create the heat map of the complete layer but I want to create the heatmap of only filtered features instead of the complete layer. Is it possible?

Thanks in advance.

multiple content: for bottom pane

I would like to also use the Advanced Search Widget with your Related Table widget. How do I specify more than one content:
in the div tag?

content: '<div id="attributesContainer"></div>','<div id="relatedRecords" style="height:100%;"></div>'

Relationship Attachments

I know this widget has been dormant for a while, but is there anyway to expose attachments in the related features?

App Settings load if not "open"

Hi, is there a configuration to tell the app settings widget to go ahead and load the settings even if the widget isn't opened? I want to put the app settings as a floating widget opened by a link in the header, but since its not opened before the user clicks on it it doesn't load until then.. Thanks!

Using fields from a related table in a popup template, that is formatted as an attribute list

Hi all,
I am new to using the CMV code, (and JS). I am trying to get related records to show up in an attribute list format. I am able to get the related records table to work properly, however the data shows up in tabs. I don't really want the tabs. I want the data to show up as it does here (with some different formatting though)
untitled

I can only get the code to show the records from the main feature class, and not from the related table. I am using the code from the CMV documents. I can swap out the "formatters.attributeList" with "formatters.relationship" but that will put the related fields into tabs.

Any help on this is much appreciated!

  `define([
'dojo/dom-construct',
'dojo/_base/lang',
'dijit/layout/TabContainer',
'dijit/layout/ContentPane',
   // 'widgets/roemhildtg/widgets/RelationshipTable/RelationshipTable'//path is relevent to     wherever you placed the file
'gis/dijit/RelationshipTable/RelationshipTable'
], function (domConstruct, lang, TabContainer, ContentPane, RelationshipTable) {
var formatters = {
     attributeList: 
    function (identifyInfo) {
    var listItem = '<li>{0}: {1}</li>';
    var html = ['<ul>'];
    for (var a in identifyInfo.attributes) {
        //make sure a is an own property
        if (identifyInfo.attributes.hasOwnProperty(a)) {
            html.push(lang.replace(listItem, [a, identifyInfo.attributes[a]]));
        }
    }
    html.push('</ul>');
    return html.join('');
},




relationship: function (relationship) {
   return function (data) {
       var content = new ContentPane({
           style: 'height:300px; width: 100%'

       }, domConstruct.create('div'));
       content.startup();


       content.addChild(new RelationshipTable(lang.mixin({
           attributes: data.attributes,
           title: 'Related Records',
           style: 'width:100%;'
       }, relationship)));
           return content.domNode;
};
    }
};
return {
map: true,
mapClickMode: true,
mapRightClickMenu: true,
identifyLayerInfos: true,
identifyTolerance: 5,
identifies: {
   LandManagement: {
                    2: {
                        title: 'BLM',
                        content: formatters.attributeList`  

limited space of relationtable in identify

i am using relation tables in identify popup for several layers of my app, and it is GREAT! (thanks for the widget)
just in some cases i prefer to have more space for the contents of tables, is there a way to enable horizontal scrolling? or is there a way other than limiting the number of columns?
from another point of view why identify popup is not resize-able?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.