title: How to Show/View or Read .dwg files on browser
body: <p>How to Show or Read .dwg files on browser without using any software means using PHP, jQuery, Javascript or any other programming language.
  For this I have gone through <a href="https://developer.autodesk.com" rel="nofollow noreferrer">https://developer.autodesk.com</a> and created an app with Client ID and Client Secret, Also created index.html file. But after that i get stuck in finding next movement for getting required "Model Derivative API". So Please guide me for the same. Thanks for giving your precious response. </p>
  
  <p>
      
      </p>
  
  <pre><code>&lt;!-- The Viewer CSS --&gt;
  &lt;link rel="stylesheet" href="https://developer.api.autodesk.com/viewingservice/v1/viewers/style.min.css" type="text/css"&gt;
  
  &lt;!-- Developer CSS --&gt;
  &lt;style&gt;
      body {
          margin: 0;
      }
      #MyViewerDiv {
          width: 100%;
          height: 100%;
          margin: 0;
          background-color: #F0F8FF;
      }
  &lt;/style&gt;
  </code></pre>
  
  <p>
  </p>
  
  <pre><code>&lt;!-- The Viewer will be instantiated here --&gt;
  &lt;div id="MyViewerDiv"&gt;&lt;/div&gt;
  
  &lt;!-- The Viewer JS --&gt;
  &lt;script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/three.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/viewer3D.min.js"&gt;&lt;/script&gt;
  
  &lt;!-- Developer JS --&gt;
  &lt;script&gt;
      var viewer;
      var options = {
          env: 'AutodeskProduction',
          accessToken: '&lt;YOUR_APPLICATION_TOKEN&gt;'
      };
      var documentId = 'urn:&lt;YOUR_URN_ID&gt;';
      Autodesk.Viewing.Initializer(options, function onInitialized(){
          Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
      });
  
      /**
      * Autodesk.Viewing.Document.load() success callback.
      * Proceeds with model initialization.
      */
      function onDocumentLoadSuccess(doc) {
  
          // A document contains references to 3D and 2D viewables.
          var viewables = Autodesk.Viewing.Document.getSubItemsWithProperties(doc.getRootItem(), {'type':'geometry'}, true);
          if (viewables.length === 0) {
              console.error('Document contains no viewables.');
              return;
          }
  
          // Choose any of the avialble viewables
          var initialViewable = viewables[0];
          var svfUrl = doc.getViewablePath(initialViewable);
          var modelOptions = {
              sharedPropertyDbPath: doc.getPropertyDbPath()
          };
  
          var viewerDiv = document.getElementById('MyViewerDiv');
          viewer = new Autodesk.Viewing.Private.GuiViewer3D(viewerDiv);
          viewer.start(svfUrl, modelOptions, onLoadModelSuccess, onLoadModelError);
      }
  
      /**
       * Autodesk.Viewing.Document.load() failuire callback.
       */
      function onDocumentLoadFailure(viewerErrorCode) {
          console.error('onDocumentLoadFailure() - errorCode:' + viewerErrorCode);
      }
  
      /**
       * viewer.loadModel() success callback.
       * Invoked after the model's SVF has been initially loaded.
       * It may trigger before any geometry has been downloaded and displayed on-screen.
       */
      function onLoadModelSuccess(model) {
          console.log('onLoadModelSuccess()!');
          console.log('Validate model loaded: ' + (viewer.model === model));
          console.log(model);
      }
  
      /**
       * viewer.loadModel() failure callback.
       * Invoked when there's an error fetching the SVF file.
       */
      function onLoadModelError(viewerErrorCode) {
          console.error('onLoadModelError() - errorCode:' + viewerErrorCode);
      }
  
  &lt;/script&gt;
  </code></pre>
  
  <p></p>