Giter Club home page Giter Club logo

dashboard-samples's Introduction

dashboard-samples

Using the ArcGIS API for JavaScript, you can develop widget, map tools, and feature action extensions for Operations Dashboard running on Windows and in a browser.

Operations Dashboard with extensions

Features

  • Buffer map tool - A map tool that creates buffers from a clicked point.
  • Elevation Profile widget - A widget that creates profile graphs by drawing lines interactively on the map.
  • ERG Chemical map tool - A map tool that generates impacts of a chemical spill at a given location.
  • Export to CSV feature action - A feature action that exports the feature results into a CSV table.
  • GeoEnrichment widget - A widget that displays an age pyramid from a clicked point.
  • Line Chart widget - A line chart widget that is powered by data from your map or external data source.
  • List widget - A custom list widget.
  • Open browser tab feature action - A feature action that opens a web page on a new browser tab.
  • Scatter plot widget - A widget that shows a scatter plot based on the selected fields of a data source.
  • Table widget - A widget that shows the attributes of the features from a data source on a grid.
  • Table widget with config - A widget that shows the attributes of the features based on the selected fields from a data source.

Requirements

Resources

  • Read our developer guide here.
  • Read our API reference here.

Instructions - How to write a sample

  1. Create a folder for your sample.
  2. In the sample folder, you should have at minimum a JSON manifest file and a HTML file. Use HTML5 for your HTML file.
  3. You can also create a JS file with the business logic for the extension.
  4. Copy the following blueprint into your sample manifest file, update the properties and remove the unnecessary properties. Read the manifest topic to learn more:
{
  "type": <Type of sample: Widget, Map Tool, Feature Action>,
  "name": <A nice name>,
  "description": <A nice description>,
  "useDataFromView": <true|false>,
  "usePortalServices": <true|false>
  "runtime" : {
   "path": <The relative path of the runtime web page (the path from under the sample folder)>,
   "iconPath": <The relative path of the icon representing the sample (the path from under the sample folder)>,
  },
  "configuration": {
   “path": <The relative path of the configuration web page (the path from under the sample folder)>,
   "requiresDataSource": <true|false>,
   "requiresMapWidget": <true|false>,
   "supportFeatureActions": <true|false>
  },
  "credits": "Esri, http://www.esri.com"
}
  1. Copy the following blueprint into your sample html file:
<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title></title>

  <!-- Add your sample style here -->

</head>

<!-- Add your sample configuration or runtime html here -->
<!-- You can also use Dijit -->

<script>
  var extensionLocation = location.pathname.replace(/\/[^/]+$/, '');
  var dojoConfig = {
    async: true, // Anything is async from now on
    locale: location.search.match(/locale=([\w\-]+)/) ? RegExp.$1 : "en-us", // The locale of the Operations Dashboard
    host application is passed by url query params
    paths: {
      "extension": extensionLocation
    }
  };
</script>
<script src="//js.arcgis.com/3.15"></script>
<script>
  require([
    "dojo/parser",
    "dojo/domReady!"
  ], function(parser){
    parser.parse();
  });
</script>
<!-- Add you additional javascript scripts here-->

</body>
</html>
  1. If your sample requires configuration, create an additional HTML file. Also you can create a JS file for the configuration's business logic. Make sure your manifest file contains the properties for the configuration.
  2. To test your sample, start Operations Dashboard in developer mode, then create a single-display operation view and add the extension. If you create a multi-display operation view, you can only open it in the Windows app, and you won't be able to debug your extension in the web browser.
  3. You can use the extension debugger to debug your sample in the Windows app.

Issues

Find a bug or want to request a new feature? Please let us know by submitting an issue.

Contributing

Esri welcomes contributions from anyone and everyone. Please see our guidelines for contributing.

Licensing

Copyright 2015 Esri

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

A copy of the license is available in the repository's license.txt file.

[](Esri Tags: ArcGIS Operations-Dashboard Extensions Samples) [](Esri Language: JavaScript)​

dashboard-samples's People

Contributors

jaychen15 avatar joalvarez avatar

Watchers

James Cloos avatar ryany avatar

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.