问题

你好，以下是代码的翻译部分：

<div class="rating-star-wrap">
    <span>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="star-rating active">
            <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z" clip-rule="evenodd"></path>
        </svg>
    </span>
    <span>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="star-rating active">
            <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z" clip-rule="evenodd"></path>
        </svg>
    </span>
    <span>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="star-rating active">
            <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z" clip-rule="evenodd"></path>
        </svg>
    </span>
    <span>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="star-rating">
            <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z" clip-rule="evenodd"></path>
        </svg>
    </span>
</div>

希望这对您有所帮助。如果您有其他问题，请随时提出。

英文:

Hi I have this code in html

&lt;div class=&quot;rating-star-wrap&quot;&gt; &lt;span&gt;&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;currentColor&quot; class=&quot;star-rating active&quot;&gt; 
    &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z&quot; clip-rule=&quot;evenodd&quot;&gt;&lt;/path&gt; 
    &lt;/svg&gt; &lt;/span&gt; &lt;span&gt;&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;currentColor&quot; class=&quot;star-rating active&quot;&gt; 
    &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z&quot; clip-rule=&quot;evenodd&quot;&gt;&lt;/path&gt; 
    &lt;/svg&gt; &lt;/span&gt; &lt;span&gt;&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;currentColor&quot; class=&quot;star-rating active&quot;&gt; 
    &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z&quot; clip-rule=&quot;evenodd&quot;&gt;&lt;/path&gt; 
    &lt;/svg&gt; &lt;/span&gt; &lt;span&gt;&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;currentColor&quot; class=&quot;star-rating active&quot;&gt; 
    &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z&quot; clip-rule=&quot;evenodd&quot;&gt;&lt;/path&gt; 
    &lt;/svg&gt; &lt;/span&gt; &lt;span&gt;&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;currentColor&quot; class=&quot;star-rating&quot;&gt; 
    &lt;path fill-rule=&quot;evenodd&quot; d=&quot;M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z&quot; clip-rule=&quot;evenodd&quot;&gt;&lt;/path&gt; 
    &lt;/svg&gt; &lt;/span&gt; 
&lt;/div&gt;

where the purpose is that i am trying to use the above code basically dynamically based upon the ratings i get by the table data

what could be the best approach for dealing with this kind of code

that is the DB and if the division by 0, is not possible, so it should be 5 stars max, no more than 5, because that is maximum what my code does.

please guide how can i moved head with that code

the unique_content_id is the productID i have

答案1

得分: 0

你可以通过SQL获取每个记录的评分：

SELECT
	IF(
		(vote_up + vote_down) > 0,               -- 防止除以零
		((vote_up / (vote_up + vote_down)) * 5), -- 5 是最大星级
		0                                        -- 尚无投票
	)
	AS starRating

然后，你可以循环遍历来自此SELECT的查询结果，并像这样打印星级：

<cfquery name="ratings" datasource="...">

	SELECT
		...

</cfquery>

<cfset svgFullStar  = '&lt;svg&gt;...&lt;/svg&gt;'>
<cfset svgEmptyStar = '&lt;svg&gt;...&lt;/svg&gt;'>

<cfloop query="ratings">

	<cfset fullStars  = round(ratings.starRating)> <!-- 或者在SQL SELECT中使用ROUND() -->
	<cfset emptyStars = (5 - fullStars)>

	<div class="row">
		<div class="product">
			#encodeForHtml(ratings.unique_content_id)#
		</div>
		<div class="rating-star-wrap">
			#repeatString(svgFullStar,  fullStars)#
			#repeatString(svgEmptyStar, emptyStars)#
		</div>
	</div>

</cfloop>

这是用于显示整星级（例如3/5）的显示逻辑。

英文:

You can fetch the rating per record via SQL:

SELECT
	IF(
		(vote_up + vote_down) &gt; 0,               -- prevent division by zero
		((vote_up / (vote_up + vote_down)) * 5), -- 5 is the maximum of stars
		0                                        -- no votes yet
	)
	AS starRating

You can then loop over your query result from this SELECT and print stars like this:

&lt;cfquery name=&quot;ratings&quot; datasource=&quot;...&quot;&gt;

	SELECT
		...

&lt;/cfquery&gt;

&lt;cfset svgFullStar  = &#39;&lt;svg&gt;...&lt;/svg&gt;&#39;&gt;
&lt;cfset svgEmptyStar = &#39;&lt;svg&gt;...&lt;/svg&gt;&#39;&gt;

&lt;cfloop query=&quot;ratings&quot;&gt;

	&lt;cfset fullStars  = round(ratings.starRating)&gt; &lt;!--- or ROUND() in the SQL SELECT ---&gt;
	&lt;cfset emptyStars = (5 - fullStars)&gt;

	&lt;div class=&quot;row&quot;&gt;
		&lt;div class=&quot;product&quot;&gt;
			#encodeForHtml(ratings.unique_content_id)#
		&lt;/div&gt;
		&lt;div class=&quot;rating-star-wrap&quot;&gt;
			#repeatString(svgFullStar,  fullStars)#
			#repeatString(svgEmptyStar, emptyStars)#
		&lt;/div&gt;
	&lt;/div&gt;

&lt;/cfloop&gt;

That's the display logic for whole stars like 3/5.

通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。

使用一些自定义ColdFusion尝试使一些代码变得动态化。

问题

答案1

CFOUTPUT 循环

Object with static methods vs object methods -> which is more effecient?

根据不同数组的排序对数组进行排序

ColdFusion服务器启动命令在Command Box中以错误退出。

What's the correct way to type hint an empty list as a literal in python?

如何在Highcharts Gantt中更改本地化的星期名称

如何在同一个流中使用多个过滤器和映射函数？

如何使用Map/Set来将代码优化到O(n)？

.NET MAUI Android在GitHub Actions上构建失败，错误代码为1。

如何在Playwright视觉比较中屏蔽多个定位器？

在C++中，可以使用可变模板参数来检索类型的内部类型。

selenium.common.exceptions.StaleElementReferenceException: Message: stale element reference: stale element not found

Creating and opening a URL to log in to Website via Basic Auth with Robot Framework/Selenium (Python)

AG Grid 在上下文菜单中以大文本形式打开

发表评论