ਐਮਾਜ਼ਾਨ ਕਿਊ ਏਮਬੈਡਿੰਗ ਡਿਵੈਲਪਰ ਬਿਜ਼ਨਸ ਇੰਟੈਲੀਜੈਂਸ ਸੇਵਾ
ਪੂਰਵ-ਸ਼ਰਤਾਂ
- QuickSight Q ਸਮਰਥਿਤ AWS ਖਾਤਾ
- QuickSight Q (ਅਤੇ ਉਸ ਵਿਸ਼ੇ ਦੀ ਵਿਸ਼ਾ ਆਈ.ਡੀ.) ਨਾਲ ਘੱਟੋ-ਘੱਟ ਇੱਕ ਵਿਸ਼ਾ ਸੈੱਟਅੱਪ ਕੀਤਾ ਗਿਆ ਹੈ।
- AWS ਖਾਤੇ ਦੇ ਨਾਲ QuickSight ਸੈਸ਼ਨ ਏਮਬੈਡਿੰਗ ਫਰੇਮਵਰਕ ਸੈੱਟਅੱਪ
- ਇਸ ਲਈ ਵਰਕਸ਼ਾਪ: https://learnquicksight.workshop.aws/en/session-embedding.html
- ਮੈਨੇਜ ਕੁਇੱਕਸਾਈਟ ਪੰਨੇ ਵਿੱਚ ਆਪਣੇ ਡੋਮੇਨ ਨੂੰ ਸੂਚੀਬੱਧ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦੇਣਾ ਯਕੀਨੀ ਬਣਾਓ
ਦਿਖਾਉਣ ਲਈ ਵਿਸ਼ਾ(ਵਿਸ਼ਿਆਂ) ਦਾ ਨਿਰਧਾਰਨ ਕਰਨਾ
QuickSight Q ਏਮਬੈਡਿੰਗ ਵਿਸ਼ਿਆਂ ਸੰਬੰਧੀ ਦੋ ਵੱਖ-ਵੱਖ ਵਰਤੋਂ ਦੇ ਮਾਮਲਿਆਂ ਦਾ ਸਮਰਥਨ ਕਰਦੀ ਹੈ। ਪਹਿਲਾ ਉਹ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਇੱਕ ਸਿੰਗਲ ਵਿਸ਼ਾ ਨਿਰਧਾਰਤ ਕੀਤਾ ਜਾਣਾ ਹੁੰਦਾ ਹੈ, ਅਤੇ ਖੋਜ ਪੱਟੀ ਰਾਹੀਂ ਸਿਰਫ਼ ਉਸ ਵਿਸ਼ੇ ਬਾਰੇ ਪੁੱਛਗਿੱਛ ਕੀਤੀ ਜਾ ਸਕਦੀ ਹੈ। ਦੂਜਾ QuickSight ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਅੰਦਰ ਮਿਆਰੀ ਅਨੁਭਵ ਹੈ, ਜਿੱਥੇ ਇੱਕ ਉਪਭੋਗਤਾ ਕੋਲ ਵਿਸ਼ਿਆਂ ਦੀ ਇੱਕ ਸੂਚੀ ਹੁੰਦੀ ਹੈ ਅਤੇ ਉਹ ਉਸ ਵਿਸ਼ੇ ਨੂੰ ਚੁਣਨ ਲਈ ਖੋਜ ਪੱਟੀ ਵਿੱਚ ਇੱਕ ਡ੍ਰੌਪਡਾਉਨ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦਾ ਹੈ ਜਿਸ ਬਾਰੇ ਉਹ ਪੁੱਛਗਿੱਛ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹਨ। ਅੱਗੇ ਵਧਣ ਤੋਂ ਪਹਿਲਾਂ, ਯਕੀਨੀ ਬਣਾਓ ਕਿ ਤੁਸੀਂ ਜਾਣਦੇ ਹੋ ਕਿ ਕੀ ਤੁਹਾਡੇ ਵਰਤੋਂ ਕੇਸ ਲਈ ਇੱਕ ਵਿਸ਼ਾ, ਜਾਂ ਏਮਬੈਡਡ ਅਨੁਭਵ ਵਿੱਚ ਵਿਸ਼ਿਆਂ ਦੀ ਸੂਚੀ ਦੀ ਲੋੜ ਹੈ।
ਡੋਮੇਨ ਨੂੰ ਮਨਜ਼ੂਰੀ ਦਿੱਤੀ ਜਾ ਰਹੀ ਹੈ
ਕਵਿੱਕਸਾਈਟ ਏਮਬੈਡਿੰਗ ਗਾਈਡਾਂ ਦੇ ਅਨੁਸਾਰ, ਤੁਸੀਂ ਵੇਖੋਗੇ ਕਿ ਤੁਹਾਨੂੰ 'ਕੁਇਕਸਾਈਟ ਪ੍ਰਬੰਧਿਤ ਕਰੋ' ਪੰਨੇ ਵਿੱਚ ਆਪਣੀ ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਡੋਮੇਨ ਨੂੰ ਸੂਚੀਬੱਧ ਕਰਨ ਦੀ ਲੋੜ ਹੈ। ਆਮ ਤੌਰ 'ਤੇ, ਤੁਹਾਨੂੰ ਇਹੀ ਕਰਨ ਦੀ ਲੋੜ ਹੈ, ਪਰ Q ਦੇ ਮਾਮਲੇ ਵਿੱਚ ਸਾਨੂੰ ਕਵਿੱਕਸਾਈਟ ਡੋਮੇਨ ਨੂੰ ਅਨੁਮਤੀ ਸੂਚੀ ਵਿੱਚ ਸ਼ਾਮਲ ਕਰਨ ਦੀ ਵੀ ਲੋੜ ਪਵੇਗੀ। ਇਹ ਅਜੀਬ ਜਾਪਦਾ ਹੈ, ਪਰ ਕਿਉਂਕਿ ਹੁੱਡ ਦੇ ਹੇਠਾਂ Q ਵੀ ਇੱਕ iframe ਦੀ ਵਰਤੋਂ ਕਰ ਰਿਹਾ ਹੈ, ਸਾਨੂੰ ਘੱਟੋ-ਘੱਟ ਹੁਣ ਲਈ, 'ਉਸੇ' ਡੋਮੇਨ ਨੂੰ ਸੂਚੀਬੱਧ ਕਰਨ ਦੀ ਲੋੜ ਹੈ। ਕਵਿੱਕਸਾਈਟ ਡੋਮੇਨ ਜਿਸਦੀ ਤੁਹਾਨੂੰ ਅਨੁਮਤੀ ਸੂਚੀ ਦੀ ਲੋੜ ਹੈ ਉਹ ਉਸ ਖੇਤਰ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ ਜਿਸਦੀ ਤੁਸੀਂ ਵਰਤੋਂ ਕਰ ਰਹੇ ਹੋ। ਸਾਬਕਾ ਲਈample, `us-east-1' ਖੇਤਰ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਏਮਬੈਡ ਕਰਨਾ, ਸਾਡਾ URL ਅਨੁਮਤੀ ਸੂਚੀ ਵਿੱਚ ਇਹ ਹੋਵੇਗਾ:
https://us-east-1.quicksight.aws.amazon.com
ਦ URL ਸਬੰਧਤ ਖੇਤਰੀ ਹਿੱਸੇ (us-east-1) ਨੂੰ ਬਦਲਣ ਦੇ ਨਾਲ ਦੂਜੇ ਖੇਤਰਾਂ ਲਈ ਵੀ ਇਹੀ ਹੋਵੇਗਾ।
ਨਵਾਂ ਸੈਸ਼ਨ ਤਿਆਰ ਕੀਤਾ ਜਾ ਰਿਹਾ ਹੈ URL
ਪਹਿਲਾਂ ਏਮਬੈਡਿੰਗ ਫਰੇਮਵਰਕ ਦਾ ਉਹ ਹਿੱਸਾ ਜੋ ਸੈਸ਼ਨ ਨੂੰ ਤਿਆਰ ਕਰਦਾ ਹੈ URL getSessionEmbed ਰਾਹੀਂURL API ਨੂੰ ਥੋੜ੍ਹਾ ਸੋਧਣ ਦੀ ਲੋੜ ਹੈ। QuickSight Q ਸੈਸ਼ਨ ਏਮਬੈਡਿੰਗ ਸਟੈਂਡਰਡ ਕੰਸੋਲ ਏਮਬੈਡਡ ਅਨੁਭਵ ਨਾਲੋਂ ਵੱਖਰੇ 'ਐਂਟਰੀ ਪੁਆਇੰਟ' 'ਤੇ ਸਮਰਥਿਤ ਹੈ। ਇਸ API ਲਈ ਦਸਤਾਵੇਜ਼ ਹੋ ਸਕਦੇ ਹਨ ਇੱਥੇ ਪਾਇਆ. ਇਸ API ਕਾਲ ਲਈ ਐਂਟਰੀ-ਪੁਆਇੰਟ ਪੈਰਾਮੀਟਰ ਨੂੰ ਬਦਲਣ ਦੀ ਲੋੜ ਹੋਵੇਗੀ - ਨਵਾਂ ਐਂਟਰੀ ਪੁਆਇੰਟ ਵਿਸ਼ੇ (ਵਿਸ਼ਿਆਂ) ਵਰਤੋਂ ਕੇਸ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ। ਸਿੰਗਲ ਵਿਸ਼ਾ ਕੇਸ ਲਈ:
entry-point = /q/search/<topicId>
ਚੋਣਕਾਰ ਵਿੱਚ ਸਾਰੇ ਵਿਸ਼ਿਆਂ ਨੂੰ ਦਿਖਾਉਣ ਲਈ, ਅਸੀਂ topicId ਨੂੰ ਛੱਡ ਦੇਵਾਂਗੇ:
entry-point = /q/search
ਇਹ ਇੱਕ ਵਾਰ ਪ੍ਰਮਾਣਿਤ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ URL ਜੋ ਕਿ ਸਿਰਫ਼ QuickSight Q ਖੋਜ ਪੱਟੀ ਦੇ ਨਾਲ ਇੱਕ ਪੰਨਾ ਰੈਂਡਰ ਕਰੇਗਾ।
ਏਮਬੇਡ ਕਰਨ ਲਈ JS SDK ਦੀ ਵਰਤੋਂ ਕਰਨਾ
ਦੇ ਨਾਲ URL, ਅਸੀਂ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ Q ਖੋਜ ਪੱਟੀ ਨੂੰ ਏਮਬੈਡ ਕਰਨ ਲਈ ਪ੍ਰਦਾਨ ਕੀਤੀ QuickSight Embedding Javascript SDK ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਾਂ। ਪਹਿਲਾਂ, ਯਕੀਨੀ ਬਣਾਓ ਕਿ ਤੁਹਾਡੇ ਕੋਲ ਏ SDK ਦੀ ਕਾਪੀ QuickSight ਟੀਮ ਤੋਂ - ਨੋਟ ਕਰੋ ਕਿਉਂਕਿ ਇਹ ਇੱਕ ਪ੍ਰੀ ਹੈview ਵਿਸ਼ੇਸ਼ਤਾ ਅਤੇ ਅਜੇ ਜਾਰੀ ਨਹੀਂ ਕੀਤੀ ਗਈ ਹੈ, SDK ਜਨਤਕ ਤੌਰ 'ਤੇ ਉਪਲਬਧ ਨਾਲੋਂ ਵੱਖਰਾ ਸੰਸਕਰਣ ਹੋਵੇਗਾ github 'ਤੇ SDK. ਅਸੀਂ ਤਿਆਰ ਕੀਤੇ ਸੈਸ਼ਨ ਦੇ ਨਾਲ SDK ਤੋਂ EmbedSession ਵਿਧੀ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਚਾਹਾਂਗੇ URL. ਏਮਬੇਡ ਸੈਸ਼ਨ ਫੰਕਸ਼ਨ ਲਈ ਸੰਬੰਧਿਤ ਵਿਕਲਪ ਹਨ (SDK ਵਿੱਚ type.js ਵਿੱਚ ਵੀ ਮਿਲਦੇ ਹਨ):
url: url of the session or dashboard to embed container: parent html element or query selector string errorCallback: callback when error occurs loadCallback: callback when visualization data load complete className: optional className to be given to iframe element isQEmbedded: embeddable object is Q search bar flag maxHeightForQ: height for Q to resize to when it expands onQBarOpenCallback: optional callback for Q search bar open onQBarCloseCallback: optional callback for Q search bar close
ਇੱਥੇ ਦੋ ਲੋੜੀਂਦੀਆਂ ਦਲੀਲਾਂ ਹਨ url ਅਤੇ ਕੰਟੇਨਰ. ਅਸੀਂ ਵਰਤਾਂਗੇ URL getSessionEmbed ਤੋਂ ਤਿਆਰ ਕੀਤਾ ਗਿਆ ਹੈURL API ਕਾਲ, ਅਤੇ ਕੰਟੇਨਰ ਲਈ ਇਹ ਤੁਹਾਡੀ ਅਰਜ਼ੀ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ। ਤੁਸੀਂ ਘੱਟੋ-ਘੱਟ ਇੱਕ ਸਧਾਰਨ ਚਾਹੁੰਦੇ ਹੋਵੋਗੇ ਏਮਬੈਡਡ iframe ਲਈ 'ਕੰਟੇਨਰ' ਦੇ ਰੂਪ ਵਿੱਚ; ਇਸ ਕੰਟੇਨਰ ਨੂੰ ਇੱਕ ਆਈਡੀ ਦਿਓ ਅਤੇ SDK ਆਰਗੂਮੈਂਟਾਂ ਵਿੱਚ ਆਈਡੀ ਵਿੱਚ ਪਾਸ ਕਰੋ। ਡਿਫੌਲਟ ਸੈਸ਼ਨ ਏਮਬੈਡਿੰਗ ਕਾਲਬੈਕ, ਐਰਰਕਾਲਬੈਕ ਅਤੇ ਲੋਡਕਾਲਬੈਕ ਉਸੇ ਤਰ੍ਹਾਂ ਕਰਦੇ ਹਨ ਜਿਵੇਂ ਨਾਮ ਸੁਝਾਅ ਦੇ ਸਕਦਾ ਹੈ - ਜੇਕਰ ਤੁਸੀਂ
ਕਸਟਮ ਵਿਵਹਾਰ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ ਜਦੋਂ ਏਮਬੈਡਡ ਪੇਜ ਲੋਡ ਹੁੰਦਾ ਹੈ, ਜਾਂ ਇੱਕ ਤਰੁੱਟੀ ਦਾ ਸਾਹਮਣਾ ਕਰਦਾ ਹੈ, ਇਹਨਾਂ ਕਾਲਬੈਕਾਂ ਵਿੱਚ ਉਹ ਤਰਕ ਦਿਓ। SDK ਨਾਲ Q ਏਮਬੈਡਡ ਮੋਡ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਸਮੇਂ, iframe ਇੱਕ ਨਿਸ਼ਚਿਤ ਉਚਾਈ (ਖੋਜ ਪੱਟੀ ਦੀ ਉਚਾਈ) ਅਤੇ ਮੂਲ HTML ਕੰਟੇਨਰ ਦੀ 100% ਚੌੜਾਈ ਹੋਵੇਗੀ। ਇਸਦਾ ਮਤਲਬ ਹੈ ਕਿ ਖੋਜ ਪੱਟੀ ਸਿਰਫ ਕੰਟੇਨਰ ਜਿੰਨੀ ਚੌੜੀ ਹੋਵੇਗੀ; ਤੁਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣਾ ਚਾਹੋਗੇ ਕਿ ਖੋਜ ਪੱਟੀ ਵਿੱਚ ਘੱਟੋ-ਘੱਟ 600px ਚੌੜਾਈ ਹੋਵੇ (ਭਾਵੇਂ ਇਸ ਤੋਂ ਅਨੁਵਾਦ ਕੀਤਾ ਗਿਆ ਹੋਵੇ view-ਚੌੜਾਈ/ਪ੍ਰਤੀਸ਼ਤtage ਜਾਂ ਸਿੱਧੇ ਤੌਰ 'ਤੇ ਨਿਰਧਾਰਤ ਕੀਤਾ ਗਿਆ ਹੈ)। iframe ਨੂੰ ਸਟਾਈਲ ਕਰਨ ਲਈ, className ਪੈਰਾਮੀਟਰ ਨੂੰ ਵਿਕਲਪਿਕ ਤੌਰ 'ਤੇ ਵੀ ਨਿਰਧਾਰਤ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ।
ਮਹੱਤਵਪੂਰਨ:
ਇੱਥੇ ਇੱਕ ਮੁੱਖ ਕਾਲਆਉਟ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ ਹੈ ਕਿ ਜਾਂ ਕੰਪੋਨੈਂਟ ਜਿਸ ਨੂੰ ਤੁਸੀਂ ਕੰਟੇਨਰ html ਐਲੀਮੈਂਟ ਦੇ ਤੌਰ 'ਤੇ ਪਾਸ ਕਰ ਰਹੇ ਹੋ, ਦੀ 'ਸਥਿਤੀ: ਪੂਰਨ' ਦੀ ਸ਼ੈਲੀ ਹੈ। ਇਹ ਉਹ ਹੈ ਜੋ ਖੋਜ ਪੱਟੀ ਨੂੰ ਤੁਹਾਡੀ ਐਪ ਦੀ ਸਮੱਗਰੀ ਨੂੰ ਹੇਠਾਂ ਬਦਲਣ ਦੀ ਬਜਾਏ ਓਵਰਲੇਅ ਦੇ ਰੂਪ ਵਿੱਚ ਫੈਲਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ।
QuickSight Q ਏਮਬੈਡਿੰਗ ਬਦਲਾਅ
ਸੈਸ਼ਨ/ਡੈਸ਼ਬੋਰਡ ਏਮਬੈਡਿੰਗ ਅਤੇ Q ਖੋਜ ਬਾਰ ਏਮਬੈਡਿੰਗ ਵਿਚਕਾਰ ਕੁਝ ਮੁੱਖ ਅੰਤਰ ਹਨ (ਹਾਲਾਂਕਿ ਵਰਤਮਾਨ ਵਿੱਚ Q ਏਮਬੈਡਿੰਗ ਸਿਰਫ਼ ਸੈਸ਼ਨ ਏਮਬੈਡਿੰਗ ਦੀ ਵਰਤੋਂ ਕਰਦੀ ਹੈ)। ਡੈਸ਼ਬੋਰਡ ਅਤੇ ਸੈਸ਼ਨ ਏਮਬੈਡਿੰਗ ਦੇ ਨਾਲ, ਫ੍ਰੇਮ ਆਮ ਤੌਰ 'ਤੇ ਇੱਕ ਸਿੰਗਲ ਸਾਈਜ਼ ਹੁੰਦਾ ਹੈ, ਡੈਸ਼ਬੋਰਡ ਜਾਂ ਵਿਸ਼ਲੇਸ਼ਣ ਸ਼ੀਟ ਦੇ ਆਕਾਰ ਦੇ ਆਧਾਰ 'ਤੇ ਕੁਝ ਰੀਸਾਈਜ਼ ਨੂੰ ਛੱਡ ਕੇ। Q ਦੇ ਨਾਲ, ਸ਼ੁਰੂ ਵਿੱਚ ਤੁਹਾਡੇ ਪੰਨੇ 'ਤੇ ਏਮਬੈਡਡ ਫਰੇਮ ਮੁਕਾਬਲਤਨ ਛੋਟਾ ਹੈ (ਅਸੀਂ ਸਿਰਫ ਅਸਲ ਖੋਜ ਪੱਟੀ ਨੂੰ ਦਿਖਾਉਣਾ ਚਾਹੁੰਦੇ ਹਾਂ)। ਜਦੋਂ ਖੋਜ ਪੱਟੀ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਜਾ ਰਹੀ ਹੈ, ਤਾਂ ਇਸ ਫ੍ਰੇਮ ਨੂੰ ਵਿਸਤਾਰ ਕਰਨ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ (ਵਿਜ਼ੂਅਲ ਨਤੀਜੇ, ਸੁਝਾਅ, ਆਦਿ ਵਰਗੇ ਵਾਧੂ ਡਰਾਪਡਾਉਨ ਤੱਤ ਦਿਖਾਉਣ ਲਈ)। ਤੁਹਾਡੀ ਐਪਲੀਕੇਸ਼ਨ ਦੀ ਸਮੱਗਰੀ ਨੂੰ ਸ਼ਿਫਟ ਕੀਤੇ ਬਿਨਾਂ ਇਸ ਫ੍ਰੇਮ ਦਾ ਵਿਸਤਾਰ ਕਰਨ ਲਈ, ਅਸੀਂ ਇਸਨੂੰ ਮੌਜੂਦਾ ਪੰਨੇ 'ਤੇ ਇੱਕ ਓਵਰਲੇਅ ਦੇ ਤੌਰ 'ਤੇ ਸੈੱਟ ਕੀਤਾ ਹੈ, ਜਿਵੇਂ ਕਿ ਅੱਜ ਕੁਇੱਕਸਾਈਟ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ ਖੋਜ ਪੱਟੀ ਕੰਮ ਕਰਦੀ ਹੈ - ਹੇਠਾਂ ਸਕ੍ਰੀਨਸ਼ੌਟਸ ਦੇਖੋ।
Q ਏਮਬੈਡਿੰਗ ਕਿਵੇਂ ਕੰਮ ਕਰਦੀ ਹੈ ਇਸ ਬਾਰੇ ਥੋੜਾ ਜਿਹਾ ਧਿਆਨ ਵਿੱਚ ਰੱਖਦੇ ਹੋਏ, ਆਓ QuickSight Q ਖਾਸ SDK ਪੈਰਾਮੀਟਰਾਂ ਨੂੰ ਵੇਖੀਏ। ਪਹਿਲਾਂ, ਸਾਨੂੰ ਸੱਚ ਦੇ ਤੌਰ 'ਤੇ ਸੈੱਟ ਕਰਨ ਲਈ isQEmbedded ਦੀ ਲੋੜ ਪਵੇਗੀ। maxHeightForQ ਇੱਕ ਵਿਕਲਪਿਕ ਆਰਗੂਮੈਂਟ ਹੈ ਜੋ ਕਿ ਤੁਹਾਡੇ ਪੰਨੇ 'ਤੇ ਸਭ ਤੋਂ ਵੱਡਾ ਕਿ Q ਫਰੇਮ ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ; ਜਿਵੇਂ ਕਿ ਪਹਿਲਾਂ ਦੱਸਿਆ ਗਿਆ ਹੈ, ਸਾਨੂੰ ਪੰਨੇ ਦੀ ਸਮੱਗਰੀ ਨੂੰ ਫੈਲਾਉਣ ਲਈ iframe ਅਤੇ ਇਸ ਦੇ ਕੰਟੇਨਰ ਦੀ ਲੋੜ ਪਵੇਗੀ। ਅਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ maxHeightForQ ਆਰਗੂਮੈਂਟ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਾਂ ਕਿ ਫਰੇਮ/ਕੰਟੇਨਰ ਤੁਹਾਡੇ ਪੰਨੇ ਦੀ ਅਧਿਕਤਮ ਉਚਾਈ ਤੋਂ ਅੱਗੇ ਦਾ ਆਕਾਰ ਨਾ ਬਦਲਦਾ ਹੈ ਅਤੇ ਇੱਕ ਸਕ੍ਰੋਲ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ ਜਾਂ ਹੋਰ ਅਣਚਾਹੇ ਵਿਵਹਾਰ ਦਾ ਕਾਰਨ ਬਣਦਾ ਹੈ। ਜੇਕਰ ਸੈੱਟ ਨਹੀਂ ਕੀਤਾ ਗਿਆ, ਤਾਂ Q ਫਰੇਮ ਦਾ ਆਕਾਰ 100vh ਹੋ ਜਾਵੇਗਾ।
ਆਖਰੀ ਦੋ Q ਖਾਸ ਮਾਪਦੰਡ ਕਾਲਬੈਕ ਹੁੰਦੇ ਹਨ ਜੋ ਉਦੋਂ ਵਾਪਰਦੇ ਹਨ ਜਦੋਂ ਏਮਬੈਡਡ ਫਰੇਮ ਦਾ ਆਕਾਰ ਬਦਲਦਾ ਹੈ। ਡਿਫੌਲਟ ਵਿਵਹਾਰ ਇੱਕ ਬੈਕਡ੍ਰੌਪ ਐਲੀਮੈਂਟ ਬਣਾਉਣਾ ਹੈ, ਅਤੇ ਇਸਦੀ ਵਰਤੋਂ ਗੂੜ੍ਹੇ ਬੈਕਗ੍ਰਾਉਂਡ ਦੀ ਦਿੱਖ ਦੇਣ ਲਈ ਹੈ ਜੋ ਅਸੀਂ QuickSight ਐਪਲੀਕੇਸ਼ਨ ਤੋਂ ਉਪਰੋਕਤ ਸਕ੍ਰੀਨਸ਼ੌਟਸ ਵਿੱਚ ਦੇਖਦੇ ਹਾਂ। ਇਹ 'ਬਾਕਸ ਤੋਂ ਬਾਹਰ' ਕਾਰਜਕੁਸ਼ਲਤਾ ਹੈ ਜੋ ਅਸੀਂ Q ਨੂੰ ਏਮਬੈਡਿੰਗ ਨੂੰ ਜਿੰਨਾ ਸੰਭਵ ਹੋ ਸਕੇ ਆਸਾਨ ਬਣਾਉਣ ਲਈ ਪ੍ਰਦਾਨ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹਾਂ - ਹਾਲਾਂਕਿ, ਅਸੀਂ ਜਾਣਦੇ ਹਾਂ ਕਿ ਇਹ ਹਰੇਕ ਐਪਲੀਕੇਸ਼ਨ ਲਈ ਕੰਮ ਨਹੀਂ ਕਰੇਗਾ ਜਿਸ ਵਿੱਚ Q ਨੂੰ ਏਮਬੈੱਡ ਕਰਨ ਦੀ ਲੋੜ ਹੈ। ਇਸ ਵਿਵਹਾਰ ਨੂੰ ਓਵਰਰਾਈਡ ਕਰੋ, ਬਸ ਤਰਕ ਨੂੰ onQBarOpenCallback ਅਤੇ onQBarCloseCallback ਵਿੱਚ ਲਿਖੋ। ਇਹ ਡਿਫੌਲਟ ਬੈਕਡ੍ਰੌਪ ਨੂੰ ਵੀ ਦਿਖਾਈ ਦੇਣ ਤੋਂ ਰੋਕੇਗਾ।
QuickSight Q ਸਟਾਈਲਿੰਗ ਵਿਕਲਪ
ਇੱਥੇ ਕੁਝ ਸਟਾਈਲਿੰਗ/ਕਾਸਮੈਟਿਕ ਵਿਕਲਪ ਹਨ ਜੋ ਅਸੀਂ Q ਖੋਜ ਪੱਟੀ ਦੀ ਦਿੱਖ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰਨ ਲਈ ਵਰਤ ਸਕਦੇ ਹਾਂ।
qBarIconDisabled: option to hide the Q search bar
qBarTopicNameDisabled: option to hide the Q search bar topic name
themeId: option to apply Quicksight theme to Q search bar
ਜੇਕਰ ਤੁਸੀਂ `Q' ਆਈਕਨ ਨੂੰ ਅਸਮਰੱਥ ਬਣਾਉਣਾ ਚਾਹੁੰਦੇ ਹੋ (ਖੋਜ ਪੱਟੀ ਦੇ ਖੱਬੇ ਪਾਸੇ, qBarIconDisabled ਪੈਰਾਮੀਟਰ ਦੀ ਵਰਤੋਂ ਕਰੋ। ਇਸੇ ਤਰ੍ਹਾਂ, ਵਿਸ਼ੇ ਦੇ ਨਾਮ ਨੂੰ ਅਸਮਰੱਥ ਬਣਾਉਣ ਲਈ, ਜੇਕਰ ਤੁਸੀਂ ਸਿਰਫ਼ ਏਮਬੈਡਡ ਮੋਡ ਵਿੱਚ ਇੱਕਵਚਨ ਵਿਸ਼ਾ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰ ਰਹੇ ਹੋ, ਤਾਂ qBarTopicNameDisabled ਦੀ ਵਰਤੋਂ ਕਰੋ। ਪੈਰਾਮੀਟਰ। ਨੋਟ ਕਰੋ ਕਿ ਇਹ ਕਾਸਮੈਟਿਕ ਕਸਟਮਾਈਜ਼ੇਸ਼ਨ ਸਿਰਫ ਉਸ ਕੇਸ ਲਈ ਉਪਲਬਧ ਹਨ ਜਦੋਂ ਤੁਸੀਂ ਇੱਕ ਵਿਸ਼ਾ ਏਮਬੈਡ ਕਰ ਰਹੇ ਹੋ।
ਜੇਕਰ ਤੁਸੀਂ ਆਪਣੀ ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਨਾਲ ਦਿੱਖ ਨੂੰ ਇਕਸਾਰ ਬਣਾਉਣ ਲਈ ਏਮਬੈਡਡ Q ਬਾਰ ਦੀ ਥੀਮ ਬਣਾਉਣਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ QuickSight ਵਿੱਚ ਇੱਕ ਨਵਾਂ ਥੀਮ ਬਣਾ ਕੇ ਅਤੇ ਥੀਮ ਆਈਡੀ ਨੂੰ SDK (ਉਦਾਹਰਨ ਲਈampਹੇਠਾਂ)
Examples
ਹੇਠ ਦਿੱਤੇ ਸਾਬਕਾamples ਇਹ ਮੰਨ ਲਵੇਗਾ ਕਿ DOM ਵਿੱਚ id `q-bar-container' ਵਾਲਾ ਇੱਕ ਕੰਟੇਨਰ ਮੌਜੂਦ ਹੈ।
ਪੂਰਵ-ਨਿਰਧਾਰਤ ਬੈਕਡ੍ਰੌਪ ਵਿਵਹਾਰ ਨਾਲ ਏਮਬੇਡਿੰਗ (q/ਖੋਜ ਮਾਰਗ ਦੇ ਨਾਲ)
ਮੰਨ ਲਓ ਕਿ ਕੰਟੇਨਰ ਦਾ ਹਾਸ਼ੀਏ ਦਾ ਸਿਖਰ 75px ਹੈ, ਇਸ ਲਈ ਅਸੀਂ maxHeightForQ ਪੈਰਾਮੀਟਰ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ ਇਸਦਾ ਲੇਖਾ-ਜੋਖਾ ਕਰਾਂਗੇ, ਤਾਂ ਜੋ ਸਕ੍ਰੌਲ ਬਾਰ ਬਣਾਉਣ ਜਾਂ ਹੋਰ ਅਣਚਾਹੇ ਵਿਵਹਾਰ ਨੂੰ ਬਣਾਉਣ ਲਈ, iframe ਸਫ਼ੇ ਦੀ ਇਜਾਜ਼ਤ ਤੋਂ ਵੱਧ ਵੱਡਾ ਨਾ ਹੋਵੇ।
function embedQSession(embedUrl) {
var containerDiv = document.getElementById("q-bar-container");
containerDiv.innerHTML = "";
var params = {
url: embedUrl, container: containerDiv,
isQEmbedded: true,
maxHeightForQ: "calc(100vh - 75px)",
};
QuickSightEmbedding.embedSession(params);
}
ਅਯੋਗ ਬੈਕਡ੍ਰੌਪ ਵਿਵਹਾਰ ਨਾਲ ਏਮਬੈਡਿੰਗ (q/ਖੋਜ ਮਾਰਗ ਦੇ ਨਾਲ)
ਇਸ ਲਈ ਸਾਬਕਾample ਅਸੀਂ ਮੰਨ ਲਵਾਂਗੇ ਕਿ ਕੰਟੇਨਰ ਪੰਨੇ ਦੇ ਸਿਖਰ 'ਤੇ ਹੈ ਤਾਂ ਜੋ ਇਹ ਬਿਨਾਂ ਕਿਸੇ ਮੁੱਦੇ ਦੇ 100% ਤੱਕ ਫੈਲ ਸਕੇ; ਸਾਨੂੰ maxHeightForQ ਦੀ ਲੋੜ ਨਹੀਂ ਪਵੇਗੀ। ਅਸੀਂ ਪੂਰਵ-ਨਿਰਧਾਰਤ ਬੈਕਡ੍ਰੌਪ ਨੂੰ ਦਿਖਾਈ ਦੇਣ ਤੋਂ ਰੋਕਣ ਲਈ onQBarOpenCallback ਅਤੇ onQBarCloseCallback ਨੂੰ ਨੋ-ਓਪ ਫੰਕਸ਼ਨਾਂ ਵਜੋਂ ਵਰਤਾਂਗੇ।
function embedQSession(embedUrl) { var containerDiv = document.getElementById("q-bar-container"); containerDiv.innerHTML = "";
var params = {
url: embedUrl, container: containerDiv,
isQEmbedded: true,
onQBarOpenCallback: () => {},
onQBarCloseCallback: () => {},
};
QuickSightEmbedding.embedSession(params);
}
ਕਸਟਮ ਬੈਕਡ੍ਰੌਪ ਵਿਵਹਾਰ ਨਾਲ ਏਮਬੈਡਿੰਗ (q/ਖੋਜ ਮਾਰਗ ਦੇ ਨਾਲ)
ਅਸੀਂ ਦੁਬਾਰਾ ਇਹ ਮੰਨ ਲਵਾਂਗੇ ਕਿ ਕੰਟੇਨਰ ਪੰਨੇ ਦੇ ਸਿਖਰ 'ਤੇ ਹੈ ਤਾਂ ਜੋ ਇਹ ਬਿਨਾਂ ਕਿਸੇ ਮੁੱਦੇ ਦੇ 100% ਤੱਕ ਫੈਲ ਸਕੇ; ਸਾਨੂੰ maxHeightForQ ਦੀ ਲੋੜ ਨਹੀਂ ਪਵੇਗੀ। ਅਸੀਂ onQBarOpenCallback ਅਤੇ onQBarCloseCallback ਨੂੰ ਕਾਲਬੈਕ ਦੇ ਤੌਰ 'ਤੇ ਵਰਤਾਂਗੇ ਜੋ ਸਾਡੀ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ ਕੁਝ ਹੋਰ ਬੈਕਡ੍ਰੌਪ ਕੰਪੋਨੈਂਟ (ਕਸਟਮਬੈਕਡ੍ਰੌਪ ਕੰਪੋਨੈਂਟ) ਨੂੰ ਹੇਰਾਫੇਰੀ ਕਰਦੇ ਹਨ ਜੋ ਅਸੀਂ ਡਿਫੌਲਟ ਦੀ ਥਾਂ 'ਤੇ ਵਰਤਣਾ ਚਾਹੁੰਦੇ ਹਾਂ। ਨੋਟ ਕਰੋ ਕਿ ਤੁਹਾਡੀਆਂ ਬੈਕਡ੍ਰੌਪ ਕਾਲਬੈਕ ਵਧੇਰੇ ਗੁੰਝਲਦਾਰ ਹੋ ਸਕਦੀਆਂ ਹਨ, ਇਹ ਸਾਬਕਾample ਸਿਰਫ਼ ਸਾਦਗੀ ਲਈ ਹੈ।
function onQBarOpen() {
customBackdropComponent.style.height = "100%";
}
function onQBarClose() {
customBackdropComponent.style.height = 0;
}
function embedQSession(embedUrl) {
var containerDiv = document.getElementById("q-bar-container");
containerDiv.innerHTML = "";
var params = {
url: embedUrl,
container: containerDiv,
isQEmbedded: true,
onQBarOpenCallback: () => {},
onQBarCloseCallback: () => {},
};
QuickSightEmbedding.embedSession(params);
}
ਡਿਫੌਲਟ ਬੈਕਡ੍ਰੌਪ ਵਿਵਹਾਰ ਨਾਲ ਏਮਬੈਡ ਕਰਨਾ (q/search/topicId ਮਾਰਗ ਦੇ ਨਾਲ)
ਅਸੀਂ ਦੁਬਾਰਾ ਇਹ ਮੰਨ ਲਵਾਂਗੇ ਕਿ ਕੰਟੇਨਰ ਦਾ ਹਾਸ਼ੀਏ ਦਾ ਸਿਖਰ 75px ਹੈ, ਇਸਲਈ ਅਸੀਂ maxHeightForQ ਪੈਰਾਮੀਟਰ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਇਸਦਾ ਲੇਖਾ-ਜੋਖਾ ਕਰਾਂਗੇ, ਤਾਂ ਕਿ iframe ਸਕ੍ਰੌਲ ਬਾਰ ਬਣਾਉਣ ਜਾਂ ਹੋਰ ਅਣਚਾਹੇ ਵਿਵਹਾਰ ਨੂੰ ਬਣਾਉਣ, ਸਫ਼ੇ ਦੀ ਇਜਾਜ਼ਤ ਤੋਂ ਵੱਧ ਵੱਡਾ ਨਾ ਹੋਵੇ। ਕਿਉਂਕਿ ਅਸੀਂ ਇੱਕ ਵਿਸ਼ੇ ਨਾਲ ਏਮਬੈਡਡ ਖੋਜ ਪੱਟੀ ਦੀ ਵਰਤੋਂ ਕਰ ਰਹੇ ਹਾਂ, ਅਸੀਂ qBarIconDisabled ਅਤੇ qBarTopicNameDisabled ਕਸਟਮਾਈਜ਼ੇਸ਼ਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਾਂ। ਇਹ ਸਾਬਕਾample ਸਾਨੂੰ ਬਿਨਾਂ ਕਿਸੇ ਆਈਕਨ ਜਾਂ ਵਿਸ਼ੇ ਦੇ ਨਾਮ ਦੇ ਇੱਕ ਖੋਜ ਪੱਟੀ ਦੇਵੇਗਾ, ਜਿਸ ਵਿੱਚ ਜੋ ਵੀ ਵਿਸ਼ਾ ਆਈਡੀ ਪਾਸ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਉਸ 'ਤੇ ਪੁੱਛਗਿੱਛ ਕਰਨ ਲਈ ਤਿਆਰ ਹੈ।
ਫੰਕਸ਼ਨ embedQSession(embedUrl) {
var containerDiv = document.getElementById("q-ਬਾਰ-ਕੰਟੇਨਰ");
containerDiv.innerHTML = “”;
var ਪਰਮ = {
url: ਏਮਬੇਡUrl,
ਕੰਟੇਨਰ: ਕੰਟੇਨਰ ਡਿਵੀ,
isQEmbedded: ਸਹੀ,
maxHeightForQ: "calc(100vh - 75px)”,
qBarIcon ਅਯੋਗ: ਗਲਤ,
qBarTopicName ਅਯੋਗ: ਗਲਤ,
};
QuickSightEmbedding.embedSession(params);
}
ਥੀਮ ਆਈਡੀ ਨਾਲ ਏਮਬੈੱਡ ਕਰਨਾ
ਜੇਕਰ ਤੁਹਾਡੇ ਕੋਲ ਨਹੀਂ ਹੈ ਤਾਂ QuickSight ਦੇ ਅੰਦਰ ਇੱਕ ਨਵਾਂ ਥੀਮ ਬਣਾਓ। ਇੱਕ ਵਿਸ਼ਲੇਸ਼ਣ ਖੋਲ੍ਹੋ, ਜਾਂ ਇੱਕ ਨਵਾਂ ਬਣਾਓ। ਖੱਬੇ ਪਾਸੇ ਥੀਮ ਚੁਣੋ।
ਅਤੇ ਫਿਰ ਸਟਾਰਟਰ ਥੀਮ ਵਿੱਚੋਂ ਇੱਕ ਚੁਣੋ ਜਿਸਨੂੰ ਤੁਸੀਂ ਤਰਜੀਹ ਦਿੰਦੇ ਹੋ ਅਤੇ ਫਿਰ "ਇਸ ਤਰ੍ਹਾਂ ਸੁਰੱਖਿਅਤ ਕਰੋ" 'ਤੇ ਕਲਿੱਕ ਕਰੋ। ਜੇਕਰ ਤੁਹਾਡੇ ਕੋਲ ਪਹਿਲਾਂ ਹੀ ਕੋਈ ਥੀਮ ਹੈ, ਤਾਂ ਤੁਸੀਂ ਥੀਮ ਬਣਾਉਣ ਦੇ ਪੜਾਅ ਨੂੰ ਛੱਡ ਸਕਦੇ ਹੋ।
ਇਹ ਤੁਹਾਨੂੰ ਥੀਮ ਸੰਪਾਦਕ ਪੰਨੇ 'ਤੇ ਲੈ ਜਾਵੇਗਾ, ਇਸ ਨੂੰ ਇੱਕ ਨਾਮ ਦਿਓ, ਆਪਣੀ ਪਸੰਦ ਅਨੁਸਾਰ ਰੰਗ ਨੂੰ ਵਿਵਸਥਿਤ ਕਰੋ ਅਤੇ ਫਿਰ ਇਸਨੂੰ ਉੱਪਰ ਸੱਜੇ ਪਾਸੇ ਸੁਰੱਖਿਅਤ ਕਰੋ।
ਹੁਣ ਜਦੋਂ ਤੁਹਾਡੇ ਕੋਲ ਇੱਕ ਥੀਮ ਹੈ, ਤੁਹਾਨੂੰ ਉਸ ਥੀਮ ਦੀ ਆਈਡੀ ਲੱਭਣ ਅਤੇ ਇਸਨੂੰ SDK ਨੂੰ ਪਾਸ ਕਰਨ ਦੀ ਲੋੜ ਹੈ। ਤੁਹਾਡੇ ਦੁਆਰਾ ਬਣਾਏ ਗਏ ਥੀਮ 'ਤੇ "ਸੰਪਾਦਨ" ਚੁਣੋ।
ਇਹ ਤੁਹਾਨੂੰ ਦੁਬਾਰਾ ਥੀਮ ਸੰਪਾਦਕ ਪੰਨੇ 'ਤੇ ਲੈ ਜਾਵੇਗਾ, ਪਰ ਇਸ ਵਾਰ, ਤੁਹਾਨੂੰ ਉੱਥੇ ਥੀਮ ਆਈਡੀ ਮਿਲੇਗੀ url ਪੱਟੀ ਇਸ ਸਥਿਤੀ ਵਿੱਚ "d39c0065bf69-4b3d-927b-9dd3a241f094" ਮੇਰੇ ਦੁਆਰਾ ਬਣਾਏ ਗਏ ਥੀਮ ਦੀ ਆਈਡੀ ਹੈ।
ਅੰਤ ਵਿੱਚ, ਤੁਸੀਂ ਥੀਮ ਆਈਡੀ ਨੂੰ ਇੱਕ ਪੈਰਾਮੀਟਰ ਵਜੋਂ SDK ਨੂੰ ਪਾਸ ਕਰਦੇ ਹੋ, ਫਿਰ ਤੁਹਾਨੂੰ ਤੁਹਾਡੇ ਐਪ ਵਿੱਚ ਇੱਕ ਥੀਮ ਵਾਲੀ Q ਬਾਰ ਮਿਲੇਗੀ।
ਫੰਕਸ਼ਨ embedQSession(embedUrl) {
var containerDiv = document.getElementById("q-ਬਾਰ-ਕੰਟੇਨਰ");
containerDiv.innerHTML = “”;
var ਪਰਮ = {
url: ਏਮਬੇਡUrl,
ਕੰਟੇਨਰ: ਕੰਟੇਨਰ ਡਿਵੀ,
isQEmbedded: ਸਹੀ,
maxHeightForQ: “calc(100vh - 75px)",
qBarIcon ਅਯੋਗ: ਗਲਤ,
qBarTopicName ਅਯੋਗ: ਗਲਤ,
ਥੀਮ ਆਈਡੀ: “d39c0065-bf69-4b3d-927b-9dd3a241f094”
};
QuickSightEmbedding.embedSession(params);
}
ਥੀਮਯੋਗ ਕੰਪੋਨੈਂਟ
ਅਸੀਂ ਤੁਹਾਨੂੰ ਇਹ ਦਿਖਾਉਣਾ ਚਾਹੁੰਦੇ ਹਾਂ ਕਿ Q ਬਾਰ ਦੇ ਅੰਦਰ ਕਿਹੜੇ ਭਾਗ ਥੀਮ ਕੀਤੇ ਜਾ ਸਕਦੇ ਹਨ, ਅਤੇ ਅਸੀਂ ਕਵਿੱਕਸਾਈਟ ਮਿਡਨਾਈਟ ਥੀਮ ਨੂੰ ਸਾਬਕਾ ਵਜੋਂ ਲਵਾਂਗੇample (ਤੁਸੀਂ ਇਸਨੂੰ ਸਟਾਰਟਰ ਥੀਮਾਂ ਵਿੱਚ ਲੱਭ ਸਕਦੇ ਹੋ)
ਸਮੱਸਿਆ ਨਿਪਟਾਰਾ
'ਫਰੇਮ ਕਰਨ ਤੋਂ ਇਨਕਾਰ ਕਰ ਦਿੱਤਾ*।quicksight.aws.amazon.com ਕਿਉਂਕਿ ਇੱਕ ਪੂਰਵਜ ਉਲੰਘਣਾ ਕਰਦਾ ਹੈ..' ਗਲਤੀ
ਇਹ ਤਰੁੱਟੀ QuickSight ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ QuickSight ਐਡਮਿਨ ਪੰਨੇ ਦੇ ਪ੍ਰਬੰਧਨ ਵਿੱਚ ਤੁਹਾਡੇ ਡੋਮੇਨ ਨੂੰ ਸੂਚੀਬੱਧ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਨਾ ਦੇਣ ਕਾਰਨ ਹੋਈ ਹੈ। ਦੋਨੋ ਖੇਤਰੀ QuickSight ਡੋਮੇਨ (ਸਾਡੇ ਲਈ-ਪੂਰਬ-1 ਲਈ, ਇਹ ਹੈ https://us-east-1.quicksight.aws.amazon.com , ਸਾਬਕਾ ਲਈample), ਅਤੇ ਨਾਲ ਹੀ ਤੁਹਾਡੀ ਐਪਲੀਕੇਸ਼ਨ ਦਾ ਡੋਮੇਨ।
ਸਫਲਤਾਪੂਰਵਕ ਏਮਬੈਡ ਕਰਨ ਤੋਂ ਬਾਅਦ ਖੋਜ ਪੱਟੀ ਨੂੰ ਨਹੀਂ ਦੇਖਿਆ ਜਾ ਸਕਦਾ ਹੈ
ਜੇਕਰ ਤੁਸੀਂ ਸਫਲਤਾਪੂਰਵਕ ਲਿੰਕ ਬਣਾਉਣ ਅਤੇ ਐਕਸੈਸ ਕਰਨ ਅਤੇ ਏਮਬੈਡ ਕਰਨ ਦੇ ਯੋਗ ਹੋ (ਬਿਨਾਂ ਕਿਸੇ ਅਨੁਮਤੀ ਜਾਂ ਹੋਰ ਸਪੱਸ਼ਟ ਤਰੁੱਟੀਆਂ ਦੇ) ਪਰ ਇੱਕ 'ਖਾਲੀ' ਸਕ੍ਰੀਨ ਪ੍ਰਾਪਤ ਕਰੋ ਜਿਸ ਵਿੱਚ ਕੋਈ ਖੋਜ ਪੱਟੀ ਦਿਖਾਈ ਨਹੀਂ ਦੇ ਰਹੀ ਹੈ, ਤਾਂ ਜਾਂਚ ਕਰਨ ਲਈ ਕੁਝ ਚੀਜ਼ਾਂ ਹਨ। ਇੱਕ ਇਹ ਹੈ ਕਿ ਜਿਸ ਉਪਭੋਗਤਾ ਨਾਲ ਤੁਸੀਂ ਏਮਬੈਡ ਕਰ ਰਹੇ ਹੋ ਉਸ ਨਾਲ ਘੱਟੋ-ਘੱਟ ਇੱਕ ਵਿਸ਼ਾ ਸਾਂਝਾ ਕੀਤਾ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ। ਦੂਜਾ, ਤੁਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣਾ ਚਾਹੋਗੇ ਕਿ ਘੱਟੋ-ਘੱਟ ਇੱਕ ਵਿਸ਼ਾ ਹੈ ਜੋ ਸਫਲਤਾਪੂਰਵਕ ਸਿਰਜਿਆ ਗਿਆ ਹੈ ਅਤੇ ਸ਼ੁਰੂ ਵਿੱਚ ਬਣਾਉਣ ਤੋਂ ਬਾਅਦ ਇੱਕ 'ਸਫਲ' ਸਥਿਤੀ ਵਿੱਚ ਹੈ। ਇਸਦੀ ਜਾਂਚ ਕਰਨ ਦਾ ਇੱਕ ਆਸਾਨ ਤਰੀਕਾ ਹੈ ਕਿ QuickSight ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ Q ਵਿੱਚ ਵਿਸ਼ੇ ਦੀ ਵਰਤੋਂ ਕਰਨਾ; ਜੇਕਰ ਇਹ ਆਮ ਤੌਰ 'ਤੇ ਕੰਮ ਕਰਦਾ ਹੈ, ਤਾਂ ਏਮਬੈਡਡ ਮੋਡ ਵਿੱਚ ਵਰਤਣਾ ਚੰਗਾ ਹੈ।
ਖੋਜ ਪੱਟੀ ਦੇ ਦਿਖਾਈ ਨਾ ਦੇਣ ਦਾ ਇੱਕ ਹੋਰ ਕਾਰਨ ਇਹ ਹੈ ਕਿ ਜਿਸ ਕੰਟੇਨਰ ਵਿੱਚ ਏਮਬੈਡਿੰਗ ਆਈਫ੍ਰੇਮ ਹੈ, ਉਹ ਕਾਫ਼ੀ ਚੌੜਾਈ ਨਹੀਂ ਦੇ ਰਿਹਾ ਹੋ ਸਕਦਾ ਹੈ। ਜਿਵੇਂ ਕਿ ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਕਿਹਾ ਗਿਆ ਹੈ, ਤੁਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣਾ ਚਾਹੋਗੇ ਕਿ ਖੋਜ ਪੱਟੀ ਨੂੰ ਆਮ ਤੌਰ 'ਤੇ ਕੰਮ ਕਰਨ ਲਈ ਘੱਟੋ-ਘੱਟ 600px ਚੌੜਾਈ ਦਿੱਤੀ ਗਈ ਹੈ।
ਖੋਜ ਪੱਟੀ ਫੈਲਦੀ ਹੈ ਪਰ ਸਮੱਗਰੀ ਨੂੰ ਹੇਠਾਂ ਬਦਲਦੀ ਹੈ
SDK ਨਾਲ ਖੋਜ ਪੱਟੀ ਨੂੰ ਪੰਨੇ 'ਤੇ ਕਿਸੇ ਵੀ ਵਾਧੂ ਸਮੱਗਰੀ ਦੇ ਸਿਖਰ 'ਤੇ ਵਿਸਤਾਰ ਕਰਨ ਲਈ ਤਿਆਰ ਕੀਤਾ ਗਿਆ ਸੀ। ਜੇਕਰ ਅਜਿਹਾ ਨਹੀਂ ਹੈ, ਤਾਂ ਕਿਰਪਾ ਕਰਕੇ ਸਰਚ ਬਾਰ ਕੰਟੇਨਰ ਨੂੰ ਯਕੀਨੀ ਬਣਾਓ ਨੂੰ 'ਸਥਿਤੀ: ਪੂਰਨ' ਨਾਲ ਸਟਾਈਲ ਕੀਤਾ ਗਿਆ ਹੈ, ਜੋ ਇਸਨੂੰ ਪੰਨੇ ਦੀ ਸਮੱਗਰੀ ਨੂੰ ਹੇਠਾਂ ਤਬਦੀਲ ਨਹੀਂ ਕਰਨ ਦੇਵੇਗਾ। ਸਾਬਕਾ ਲਈampLe:
<div id="q-search-container" style="position: absolute; width: 100%"></div>
SDK ਸੰਸ਼ੋਧਨ ਤਬਦੀਲੀ ਲੌਗ
- V1(5/15/21): ਸ਼ੁਰੂਆਤੀ ਕਸਟਮ `Q- ਤਿਆਰ' SDK
- V1.1 (5/25/21)
- iframe ਦੀ ਉਚਾਈ ਨੂੰ ਖੋਜ ਪੱਟੀ ਦੀ ਉਚਾਈ ਤੱਕ ਫਿਕਸ ਕਰਨ ਲਈ ਬਦਲੋ, ਉਪਭੋਗਤਾ Q ਮੋਡ ਵਿੱਚ ਨਿਸ਼ਚਿਤ ਨਹੀਂ ਕਰ ਸਕਦਾ ਹੈ
- Q ਮੋਡ ਲਈ ਪੇਰੈਂਟ ਕੰਟੇਨਰ ਦੇ 100% 'ਤੇ iframe ਚੌੜਾਈ ਸੈੱਟ ਕਰੋ। ਨੋਟ ਕਰੋ ਕਿ ਖੋਜ ਪੱਟੀ ਦੀ ਚੌੜਾਈ ਅਜੇ ਵੀ ਮੂਲ ਕੰਟੇਨਰ ਦੇ ਆਕਾਰ ਦੁਆਰਾ ਸੀਮਿਤ ਕੀਤੀ ਜਾ ਸਕਦੀ ਹੈ।
- V1.1 (5/25/21)
ਦਸਤਾਵੇਜ਼ / ਸਰੋਤ
 |
ਐਮਾਜ਼ਾਨ ਕਿਊ ਏਮਬੈਡਿੰਗ ਡਿਵੈਲਪਰ ਬਿਜ਼ਨਸ ਇੰਟੈਲੀਜੈਂਸ ਸੇਵਾ [pdf] ਯੂਜ਼ਰ ਗਾਈਡ Q ਏਮਬੇਡਿੰਗ ਡਿਵੈਲਪਰ ਬਿਜ਼ਨਸ ਇੰਟੈਲੀਜੈਂਸ ਸਰਵਿਸ, ਡਿਵੈਲਪਰ ਬਿਜ਼ਨਸ ਇੰਟੈਲੀਜੈਂਸ ਸਰਵਿਸ, ਇੰਟੈਲੀਜੈਂਸ ਸਰਵਿਸ |
