0

私は視覚化の仕事を始めており、Google Chartを使用しています、棒グラフを作成しようとしています

https://developers.google.com/chart/interactive/docs/gallery/barchart

水平バーにマーカーを垂直線として設定するか、または円のポイントを設定して、関心のある値を示すことができます。棒グラフの特定のポイントをマークする方法を提供できる別のオプションも、おそらく問題ありません。

では、マーカーを使用してこの種の棒グラフを作成する方法を知っている人はいますか？

編集済み：グラフは次のようになります。

http://chart.apis.google.com/chart?chs=100x40&cht=bhs&chco=000000&chd=t:65&chbh=15&chm=r,ff0000,0,0.49,0.51,1

ただし、画像としてではなく、棒グラフの視覚化を使用して実行できるため、オブジェクトと対話できます。

どうもありがとう、

4

1 に答える 1

0

Googleチャートを使用した解決策を提案していないため、この回答が気に入らない場合がありますが、少し我慢していただければ、これが役立つか、少なくとも有益であることがわかるかもしれません. とにかく、純粋な HTML と CSS のグラフ作成ソリューションでは、多くの高度な視覚化の機会を提供することはできませんが、実際の経験に基づいて、棒グラフに関して CSS と HTML だけでかなり多くのことができると私は考えています。 . A List Apart に関する Wilson Miner の記事「Accessible Data Visualization with Web Standards 」を読むことをお勧めします。

次に、実装しようとしているチャートを模倣する、このフィドルの次の簡単で汚い CSS/HTML グラフを検討してください。

http://jsfiddle.net/9mJzd/

ここでは、棒グラフの一部のみを貼り付けます。また、フィドルの CSS を確認する必要があります。

<td>
    <div class="BarWrap">
       <div class="BarBar" style="width: 100%;" title="Ty Cabbage: .426"></div>
       <div class="BarAvg" style="left: 62%" title="League Average: .278"></div>
    </div>
</td>

jQuery とツールチップ プラグイン (jQuery UI のツールチップなど)を追加するだけで、棒グラフに対話機能が追加されます。

于 2013-03-11T00:03:31.637 に答える