1

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: 検閲で申し訳ありませんが、個人情報です。

4

2 に答える 2

1

その必要はありません。Chart は、iPad のズーム ジェスチャをサポートしています。CSSベースのスケール変換でズームイン・アウトできるのですが、通常のブラウザでは見苦しいのでオフにしています。同等のズーム効果が必要な場合、最善の解決策は、サイズの異なる 2 ~ 3 個のアイテム テンプレートを作成し、それらを自動的に切り替えることです。または、小さいチャートが必要な場合は、アイテム テンプレートを小さくします。Web サイトの例を参照してください。

ここに画像の説明を入力

于 2013-09-06T22:18:46.233 に答える