1

SVG 形式の USA マップがあります。PHP フォームを介してユーザーが入力する MySQL ファイルに状態用に保存されている色の 16 進値に応じて、各状態を色で塗りつぶす必要があります。

さらに説明すると、米国の地図を SVG として表示する私の php プログラムでは、最初のコードを次に示します。ここでは説明のみを目的として、最初の州であるアラスカを赤にハードコードしました。

$(document).ready(function() {
  $('#map').usmap({
  stateSpecificStyles': { 'AK' : {fill: '#f00'}
},

etc, ...状態ごとに繰り返す...

私がやりたいのは、「fill: '#f00」を AK の MySQL レコードの 16 進カラー フィールドに格納されているカラー値に置き換えることです。

だから、私の質問は：

状態の MySQL レコードに保存されている色の 16 進値をその状態の SVG オブジェクトに渡し、塗りつぶしの色を適用できるようにするにはどうすればよいですか?

4

2 に答える 2

1

SVG はどのように含まれていますか? インライン化されていますか、または or を介して埋め込まれています<image>か<object>? 答えは解決策に影響します。

今のところインライン化されていると仮定すると、これが私が行う方法です。

各州に ID を付与します。例えば。

<g id="AK"> ... </g>

次に、CSS スタイル (PHP スクリプトに追加) を追加できます。

#AK {fill: red;}

または、JS を使用して直接設定することもできます (例: JSON として読み取り、onLoad で適用):

document.getElementById("AK").style.fill = "red";
于 2013-10-26T00:58:47.943 に答える
0

問題は、色の周りにいくつかの引用符がないことだと思います. それ以外の：

$('#map').usmap({ 'stateSpecificStyles': { 'AK' : {fill: <?php echo '#f00'; ?>} } });

試す：

$('#map').usmap({ 'stateSpecificStyles': { 'AK' : {fill: '<?php echo '#f00'; ?>'} } });
于 2013-10-26T17:30:11.563 に答える