Why Annotation tools not appearing on my PDF?

Community Beginner ,
Mar 05, 2021 Mar 05, 2021

Copy link to clipboard

Copied

Hi,

I am using an iframe to render PDF in div tag as per the documentation. I have included my registered client id for my pdf embed api. I have also included embed mode as Inline and showAnnotationTools: true. Still I do not see Annotation tools appearing on PDF viewer. Below is the code I am using-

 

<div id="adobe-dc-view" style="width: 800px; box-shadow: 1px 1px 10px 1px #dadada;"></div>
<script type="text/javascript" src="https://documentcloud.adobe.com/view-sdk/main.js"></script>
  <script type="text/javascript">
	  /* The PDF embed mode option here */
	  const viewerConfig = {
		  embedMode: "IN_LINE",
		  showLeftHandPanel: true,
		  showAnnotationTools: true,
		  showDownloadPDF: true, 
		  showPrintPDF: true,
		  showPageControls: true
	  };

	  document.addEventListener("adobe_dc_view_sdk.ready", function () {
		  /* Initialize the AdobeDC View object */
		  var adobeDCView = new AdobeDC.View({
			  /* Registered client id */
			  clientId: "<my client id>",
			  /* The div id in which PDF should be rendered */
			  divId: "adobe-dc-view",
		  });

		  /* Invoke the file preview API on Adobe DC View object */
		  adobeDCView.previewFile({
			  /* Pass information on how to access the file */
			  content: {
				  /* Location of file where it is hosted */
				  location: {
					  url: "https://documentcloud.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
				  },
			  },
			  /* Pass meta data of file */
			  metaData: {
				  /* file name */
				  fileName: "Bodea Brochure.pdf"
			  }
		  }, viewerConfig);

		  /* Define Save API Handler */
		  var saveApiHandler = function (metaData, content, options) {
			  console.log(metaData, content, options);
			  return new Promise(function (resolve, reject) {
				  /* Dummy implementation of Save API, replace with your business logic */
				  setTimeout(function () {
					  var response = {
						  code: AdobeDC.View.Enum.ApiResponseCode.SUCCESS,
						  data: {
							  metaData: Object.assign(metaData, { updatedAt: new Date().getTime() })
						  },
					  };
					  resolve(response);
				  }, 2000);
			  });
		  };

		  adobeDCView.registerCallback(
			  AdobeDC.View.Enum.CallbackType.SAVE_API,
			  saveApiHandler,
			  {}
		  );
	  });
  </script>

 

Any suggestions what I am missing here?

 

Krunal
TOPICS
PDF Embed API

Views

84

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct Answer

Adobe Community Professional , Mar 05, 2021 Mar 05, 2021
The IN_LINE mode does not support the annotation tools. You'll need to use FULL_WINDOW.

Likes

Translate

Translate
Adobe Community Professional ,
Mar 05, 2021 Mar 05, 2021

Copy link to clipboard

Copied

The IN_LINE mode does not support the annotation tools. You'll need to use FULL_WINDOW.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 08, 2021 Mar 08, 2021

Copy link to clipboard

Copied

Thanks @Joel_Geraci ,

Although, not sure if I missed that in documentation anywhere. However, for some reason it is not showing in full screen vertically. See below image. Any idea?

adobe screen.jpg

Krunal

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Mar 08, 2021 Mar 08, 2021

Copy link to clipboard

Copied

LATEST

I don't think it is documented anywhere. However, If you go to the playground, and tap "customize" you can look at the settings for each of the display modes and see which UI customizations are enabled for that mode and which are not.

I think the issue you have above is that the height of your view element isn't set. 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines