我的客户希望我创建一个页面,其中包含一堆显示为云的外部链接。他希望能够添加外部链接并编辑字体大小和颜色。
此云必须位于页面的中心,并从中心增长。 我找到了现成的解决方案,但它并不完美,需要修复。我试图解决它,但不幸的是没有成功。 例如,我无法理解为什么改变颜色不起作用。这是:
<?
$array = array (
0 => array ('link' => 'http://123.com', 'name' => 'qq', 'cnt' => 100)
, 1 => array ('link' => 'http://123.com', 'name' => 'ww', 'cnt' => 2)
, 2 => array ('link' => 'http://123.com', 'name' => 'ee', 'cnt' => 3)
, 3 => array ('link' => 'http://123.com', 'name' => 'rr', 'cnt' => 61)
, 4 => array ('link' => 'http://123.com', 'name' => 'tt', 'cnt' => 5)
, 5 => array ('link' => 'http://123.com', 'name' => 'yy', 'cnt' => 60)
, 6 => array ('link' => 'http://123.com', 'name' => 'uu', 'cnt' => 7)
, 7 => array ('link' => 'http://123.com', 'name' => 'ii', 'cnt' => 8)
, 8 => array ('link' => 'http://123.com', 'name' => 'iii', 'cnt' => 9)
, 9 => array ('link' => 'http://123.com', 'name' => 'oo', 'cnt' => 10)
, 10 => array ('link' => 'http://123.com', 'name' => 'pp', 'cnt' => 11)
, 11 => array ('link' => 'http://123.com', 'name' => 'aa', 'cnt' => 12)
, 12 => array ('link' => 'http://123.com', 'name' => 'ss', 'cnt' => 10)
, 13 => array ('link' => 'http://123.com', 'name' => 'dd', 'cnt' => 11)
, 14 => array ('link' => 'http://123.com', 'name' => 'ff', 'cnt' => 12)
, 15 => array ('link' => 'http://123.com', 'name' => 'gg', 'cnt' => 10)
);
echo '<div style="font-family:arial; font-size: 10px; width: 300px; text-align: center; position: absolute;
top: 100px; left: 50%; margin-left: -150px;">';
$params['min_size'] = 100;
$params['max_size'] = 1000;
$params['colors'] = array(0 => 'red', 1 => 'blue', 2 => 'brown', 3 => 'pink', 4 => 'green');
ntts_cloud_ShowCloud($array, $params);
echo '</div>';
function ntts_cloud_FlipArray($array)
{
$rows = array_keys($array);
$first_row_key = $rows[0];
$cols = array_keys($array[$first_row_key]);
$rows_cnt = count($rows);
$cols_cnt = count($cols);
for($i = 0; $i < $rows_cnt; $i++)
{
for($j = 0; $j < $cols_cnt; $j++)
{
$result[$cols[$j]][$rows[$i]] = $array[$rows[$i]][$cols[$j]];
}
}
return $result;
}
function ntts_cloud_ShowCloud($entries, $config = 0)
{
//$entries is array of cloud elements
//each element should be present as associative array with follows keys
//'name' - name of the element
//'link' - URL
//'cnt' - weight of the element
$colors = array(
0 => '73cf3b',
1 => '000',
2 => '000',
3 => '000',
4 => '000',
5 => 'red',
6 => '000',
7 => '000',
8 => '000',
9 => '000',
10 => '000',
11 => '000',
12 => '000',
13 => '000',
14 => '000',
15 => '000');
//font size in percent
$min_size = (isset($config['min_size'])) ? $config['min_size'] : 100;
$max_size = (isset($config['max_size'])) ? $config['max_size'] : 200;
if(is_array($config))
{
if(isset($config['colors']) && is_array($config['colors']))
{
$colors = $config['colors'];
}
}
$flipped = ntts_cloud_FlipArray($entries);
$min = min($flipped['cnt']);
$max = max($flipped['cnt']);
array_multisort($flipped['cnt'], SORT_DESC, $flipped['name'], $flipped['link']);
$entries = ntts_cloud_FlipArray($flipped);
$shown_entries = array();
$keys = array();
$cnt = count($entries);
$limit = (isset($config['limit'])) ? min($config['limit'], $cnt) : $cnt;
for($i = 0; $i < $limit; $i++)
{
$entries[$i]['cnt'] -= $min;
if($max > $min)
{
$entries[$i]['cnt'] /= ($max - $min);
}
$entries[$i]['cnt'] *= ($max_size - $min_size);
$entries[$i]['cnt'] += $min_size;
$entries[$i]['cnt'] = round($entries[$i]['cnt']);
$key = md5($entries[$i]['name']);
$shown_entries[$key] = $entries[$i];
$keys[$i] = $key;
//проверка корректности url на наличие префикса http://
if(!preg_match('/^http:/i', $entries[$i]['link']))
{
$shown_entries[$key]['link'] = 'http://'.$entries[$i]['link'];
}
}
sort($keys);
$cnt = count($keys);
$colors_cnt = count($colors);
for($i = 0; $i < $cnt; $i++)
{
$key = $keys[$i];
$idx = hexdec($key[31]) % $colors_cnt;
$color = $colors[$idx];
echo '<nobr><a href='.$shown_entries[$key]['link']
.' style="font-size:'.$shown_entries[$key]['cnt'].'%; '
.' text-decoration:none; color: #'.$color.';'
.'">'.$shown_entries[$key]['name'].'</a></nobr> ' ;
}
}
?>
<? error_reporting(7);
function ntts_cloud_ShowCloud($entries, $config = 0)
{
foreach ($entries as $line)
{
echo '<nobr><a href='.$line['link']
.' style="font-size:'.$line['cnt'].'px; '
.' text-decoration:none; color: '.$line['color'].';'
.'">'.$line['name'].'</a></nobr> ' ;
}
}
$array = array (
0 => array ('link' => 'http://1.ru', 'name' => 'kdsf', 'cnt' => 18,'color'=>'red')
, 1 => array ('link' => 'http://1.ru', 'name' => 'ddd', 'cnt' => 12,'color'=>'green')
, 2 => array ('link' => 'http://1.ru', 'name' => ' ddd', 'cnt' => 26,'color'=>'black')
, 3 => array ('link' => 'http://1.ru', 'name' => 'jjj', 'cnt' => 16,'color'=>'blue')
, 4 => array ('link' => 'http://1.net', 'name' => 'ccc', 'cnt' => 38,'color'=>'#555555')
, 5 => array ('link' => 'http://1.ru', 'name' => 'llll', 'cnt' => 40,'color'=>'gray')
, 6 => array ('link' => 'http://1.net', 'name' => 'xxxx', 'cnt' => 15,'color'=>'red')
, 7 => array ('link' => 'http://1.ru', 'name' => 'wewe', 'cnt' => 23,'color'=>'yellow')
, 8 => array ('link' => 'http://1.ru', 'name' => 'ddd', 'cnt' => 30,'color'=>'#1234d5')
);
echo '<div style="margin-left:30%;font-family:arial; font-size: 10px; width: 300px; text-align: center">';
ntts_cloud_ShowCloud($array, $params);
echo '</div>';
?>
答案 0 :(得分:0)
只需删除此行中的“#”:
.' text-decoration:none; color: #'.$color.';'