BasicPrimitives API を使用して組織図を作成しようとしています。この特定の API は div id またはクラスを取り、そのコンテンツをチャートで動的に埋めます。API が提供していないズームインおよびズームアウト機能を追加したいのですが、実現できませんでした。私が望むのは、内部のすべてを拡大または縮小し、すべての部分をスクロールして表示する必要があるコンピューター ゲームのビューポートを模倣することです。divを試しtransform: scroll()
てみましたが、コンテンツ全体をスケーリングしません。実際、それができるかどうかはわかりませんが、スクロールしてもチャートの大部分に到達できません。それから zoomooz API を試しましたが、また失敗しました。これとこれを確認しましたが、機能しませんでした。
私のdivは次のとおりです。
<div id="diagram" style="height: 400px; width: 946px;">
</div>
その中で、私が使用している API は、すべてのチャートなどを含む別の div を作成します。次のコードでそれをスケーリングすると、スクロールはダイアグラムの一部に到達できません。
jQuery(".orgdiagram > div").css({
transform: "scale(1.25)"
});
上のコードと合わせて、高さを変えたり前後のスケールを変えたりしてみましたがうまくいきませんでした。私はWeb技術にかなり慣れていません。
これはシチュエーションのスクリーンショットで、上部は拡大縮小済みバージョンです。下部はポストスケールです。私の質問は、何が問題なのですか? スケーリング後にスクロールが異常に動作する理由と、これを修正するにはどうすればよいですか。
PS: 検閲で申し訳ありませんが、個人情報です。