改下哥尼斯堡網頁程式
Re: 改下哥尼斯堡網頁程式
加上導出動畫功能,改藍色為淡紫色,把stroke-array「7 7」改為「5 5」,當modal存在時按空白鍵可以直接開始。
https://ejsoon.vip/wp-content/uploads/2 ... e7921.html
- 附件
-
konigsberg20260417animatewhite7921.7z- (19.6 KiB) 已下载 12 次
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
<svg id="konigsberganimate" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="720" height="480" viewBox="0 0 720 480" style="background: lightblue; height: 414px; width: 886px;" opacity="0"><g class="appendarea"><circle cx="180.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="0"/><circle cx="360.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="1"/><circle cx="540.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="2"/><circle cx="90.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="3"/><circle cx="270.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="4"/><circle cx="450.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="5"/><circle cx="630.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="6"/><circle cx="180.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="7"/><circle cx="360.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="8"/><circle cx="540.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="9"/><path class="arrowbrg" d="M118,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 180,203.885)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 180,203.885" to="180 180,203.885" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 180,203.885" to="360 180,203.885" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 180,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M298,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 360,203.885)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 360,203.885" to="180 360,203.885" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 360,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 495,281.827)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 495,281.827" to="240 495,281.827" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 495,281.827" to="420 495,281.827" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 495,281.827" to="240 495,281.827" dur="1s" fill="freeze" begin="kam10.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="60 495,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M478,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 540,203.885)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 540,203.885" to="360 540,203.885" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 540,203.885" to="180 540,203.885" dur="1s" fill="freeze" begin="kam8.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 540,203.885" to="360 540,203.885" dur="1s" fill="freeze" begin="kam10.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 540,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 405,125.942)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 405,125.942" to="420 405,125.942" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="240 405,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 315,125.942)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 315,125.942" to="300 315,125.942" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 315,125.942" to="480 315,125.942" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 315,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 315,281.827)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 315,281.827" to="240 315,281.827" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 315,281.827" to="420 315,281.827" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 315,281.827" to="240 315,281.827" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="60 315,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 270,359.769)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam7.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam9.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 270,359.769" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 450,359.769)"><set attributeName="visibility" to="visible" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam2.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,359.769" to="360 450,359.769" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,359.769" to="180 450,359.769" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,359.769" to="360 450,359.769" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,359.769" to="180 450,359.769" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,359.769" to="360 450,359.769" dur="1s" fill="freeze" begin="kam8.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 450,359.769" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 495,125.942)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 495,125.942" to="480 495,125.942" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="300 495,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 450,48)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,48" to="360 450,48" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 450,48" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 270,48)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,48" to="360 270,48" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 270,48" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 585,125.942)"><set attributeName="visibility" to="visible" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 585,281.827)"><set attributeName="visibility" to="visible" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 225,125.942)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M73,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 135,281.827)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 225,281.827)"><set attributeName="visibility" to="visible" begin="kap6.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap6.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam6.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 405,281.827)"><set attributeName="visibility" to="visible" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path></g><g class="bottomarea"><circle cx="90.00" cy="203.88" r="24" fill="#77d" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj0" to="white" begin="kastart.end+1s"/><set attributeName="visibility" to="hidden" begin="kam0.begin"/><set attributeName="visibility" to="visible" begin="kam0.end"/><set attributeName="cx" to="540.00" begin="kam0.end"/><set attributeName="cy" to="359.77" begin="kam0.end"/><set id="kad0" attributeName="stroke" to="none" begin="kam0.end+1.2s"/><set attributeName="stroke" id="kaj2" to="white" begin="kad1.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam2.begin"/><set attributeName="visibility" to="visible" begin="kam2.end"/><set attributeName="cx" to="360.00" begin="kam2.end"/><set attributeName="cy" to="48.00" begin="kam2.end"/><set id="kad2" attributeName="stroke" to="none" begin="kam2.end+1.2s"/><set attributeName="stroke" id="kaj4" to="white" begin="kad3.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam4.begin"/><set attributeName="visibility" to="visible" begin="kam4.end"/><set attributeName="cx" to="180.00" begin="kam4.end"/><set attributeName="cy" to="359.77" begin="kam4.end"/><set id="kad4" attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="stroke" id="kaj6" to="white" begin="kad5.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam6.begin"/><set attributeName="visibility" to="visible" begin="kam6.end"/><set attributeName="cx" to="540.00" begin="kam6.end"/><set attributeName="cy" to="359.77" begin="kam6.end"/><set id="kad6" attributeName="stroke" to="none" begin="kam6.end+1.2s"/><set attributeName="stroke" id="kaj8" to="white" begin="kad7.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam8.begin"/><set attributeName="visibility" to="visible" begin="kam8.end"/><set attributeName="cx" to="630.00" begin="kam8.end"/><set attributeName="cy" to="203.88" begin="kam8.end"/><set id="kad8" attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="stroke" id="kaj10" to="white" begin="kad9.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam10.begin"/><set attributeName="visibility" to="visible" begin="kam10.end"/><set attributeName="cx" to="540.00" begin="kam10.end"/><set attributeName="cy" to="359.77" begin="kam10.end"/><set id="kad10" attributeName="stroke" to="none" begin="kam10.end+1.2s"/><set attributeName="cx" to="90.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle><circle cx="630.00" cy="203.88" r="24" fill="#3d3" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj1" to="white" begin="kad0.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam1.begin"/><set attributeName="visibility" to="visible" begin="kam1.end"/><set attributeName="cx" to="180.00" begin="kam1.end"/><set attributeName="cy" to="359.77" begin="kam1.end"/><set id="kad1" attributeName="stroke" to="none" begin="kam1.end+1.2s"/><set attributeName="stroke" id="kaj3" to="white" begin="kad2.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam3.begin"/><set attributeName="visibility" to="visible" begin="kam3.end"/><set attributeName="cx" to="180.00" begin="kam3.end"/><set attributeName="cy" to="48.00" begin="kam3.end"/><set id="kad3" attributeName="stroke" to="none" begin="kam3.end+1.2s"/><set attributeName="stroke" id="kaj5" to="white" begin="kad4.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam5.begin"/><set attributeName="visibility" to="visible" begin="kam5.end"/><set attributeName="cx" to="360.00" begin="kam5.end"/><set attributeName="cy" to="359.77" begin="kam5.end"/><set id="kad5" attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="stroke" id="kaj7" to="white" begin="kad6.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam7.begin"/><set attributeName="visibility" to="visible" begin="kam7.end"/><set attributeName="cx" to="180.00" begin="kam7.end"/><set attributeName="cy" to="359.77" begin="kam7.end"/><set id="kad7" attributeName="stroke" to="none" begin="kam7.end+1.2s"/><set attributeName="stroke" id="kaj9" to="white" begin="kad8.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam9.begin"/><set attributeName="visibility" to="visible" begin="kam9.end"/><set attributeName="cx" to="360.00" begin="kam9.end"/><set attributeName="cy" to="359.77" begin="kam9.end"/><set id="kad9" attributeName="stroke" to="none" begin="kam9.end+1.2s"/><set attributeName="stroke" id="kaj11" to="white" begin="kad10.begin+1s"/><set attributeName="cx" to="630.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle></g><g class="middlearea" visibility="hidden"><line class="redline" x1="360.00" y1="359.77" x2="270.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="359.77" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="359.77" x2="540.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="359.77" x2="180.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="450.00" y1="203.88" x2="270.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="450.00" y1="203.88" x2="630.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="540.00" y1="359.77" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="180.00" y1="359.77" x2="270.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="630.00" y1="203.88" x2="540.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><set id="kad11" attributeName="visibility" to="visible" begin="kaj11.begin+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></g><path id="movingroute" class="route_tmp hide" d="M630,203.88457268119896 L 450,203.88457268119896 L 540,359.7691453623979 " fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4" stroke-dasharray="12 7" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="d" id="kap0" to="M 90.00,203.88 L 270.00,203.88 L 450.00,203.88 L 540.00,359.77" begin="kaj0.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap0.begin" end="kap0.end"/><set attributeName="d" id="kap1" to="M 630.00,203.88 L 450.00,203.88 L 360.00,48.00 L 270.00,203.88 L 360.00,359.77 L 180.00,359.77" begin="kaj1.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap1.begin" end="kap1.end"/><set attributeName="d" id="kap2" to="M 540.00,359.77 L 360.00,359.77 L 270.00,203.88 L 360.00,48.00" begin="kaj2.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap2.begin" end="kap2.end"/><set attributeName="d" id="kap3" to="M 180.00,359.77 L 360.00,359.77 L 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00 L 180.00,48.00" begin="kaj3.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap3.begin" end="kap3.end"/><set attributeName="d" id="kap4" to="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 180.00,359.77" begin="kaj4.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap4.begin" end="kap4.end"/><set attributeName="d" id="kap5" to="M 180.00,48.00 L 270.00,203.88 L 90.00,203.88 L 180.00,359.77 L 360.00,359.77" begin="kaj5.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap5.begin" end="kap5.end"/><set attributeName="d" id="kap6" to="M 180.00,359.77 L 270.00,203.88 L 360.00,359.77 L 540.00,359.77" begin="kaj6.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap6.begin" end="kap6.end"/><set attributeName="d" id="kap7" to="M 360.00,359.77 L 180.00,359.77" begin="kaj7.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap7.begin" end="kap7.end"/><set attributeName="d" id="kap8" to="M 540.00,359.77 L 360.00,359.77 L 450.00,203.88 L 630.00,203.88" begin="kaj8.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap8.begin" end="kap8.end"/><set attributeName="d" id="kap9" to="M 180.00,359.77 L 360.00,359.77" begin="kaj9.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap9.begin" end="kap9.end"/><set attributeName="d" id="kap10" to="M 630.00,203.88 L 450.00,203.88 L 540.00,359.77" begin="kaj10.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap10.begin" end="kap10.end"/></path><g class="toparea"><circle cx="0" cy="0" r="24" fill="#77d" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam0.begin"/><animateMotion id="kam0" begin="kap0.end" dur="3s" fill="freeze" path="M 90.00,203.88 L 270.00,203.88 L 450.00,203.88 L 540.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam0.end"/><set attributeName="visibility" to="visible" begin="kam2.begin"/><animateMotion id="kam2" begin="kap2.end" dur="3s" fill="freeze" path="M 540.00,359.77 L 360.00,359.77 L 270.00,203.88 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam2.end"/><set attributeName="visibility" to="visible" begin="kam4.begin"/><animateMotion id="kam4" begin="kap4.end" dur="5s" fill="freeze" path="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam4.end"/><set attributeName="visibility" to="visible" begin="kam6.begin"/><animateMotion id="kam6" begin="kap6.end" dur="3s" fill="freeze" path="M 180.00,359.77 L 270.00,203.88 L 360.00,359.77 L 540.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam6.end"/><set attributeName="visibility" to="visible" begin="kam8.begin"/><animateMotion id="kam8" begin="kap8.end" dur="3s" fill="freeze" path="M 540.00,359.77 L 360.00,359.77 L 450.00,203.88 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam8.end"/><set attributeName="visibility" to="visible" begin="kam10.begin"/><animateMotion id="kam10" begin="kap10.end" dur="2s" fill="freeze" path="M 630.00,203.88 L 450.00,203.88 L 540.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam10.end"/></circle><circle cx="0" cy="0" r="24" fill="#3d3" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam1.begin"/><animateMotion id="kam1" begin="kap1.end" dur="5s" fill="freeze" path="M 630.00,203.88 L 450.00,203.88 L 360.00,48.00 L 270.00,203.88 L 360.00,359.77 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam1.end"/><set attributeName="visibility" to="visible" begin="kam3.begin"/><animateMotion id="kam3" begin="kap3.end" dur="6s" fill="freeze" path="M 180.00,359.77 L 360.00,359.77 L 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00 L 180.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam3.end"/><set attributeName="visibility" to="visible" begin="kam5.begin"/><animateMotion id="kam5" begin="kap5.end" dur="4s" fill="freeze" path="M 180.00,48.00 L 270.00,203.88 L 90.00,203.88 L 180.00,359.77 L 360.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam5.end"/><set attributeName="visibility" to="visible" begin="kam7.begin"/><animateMotion id="kam7" begin="kap7.end" dur="1s" fill="freeze" path="M 360.00,359.77 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam7.end"/><set attributeName="visibility" to="visible" begin="kam9.begin"/><animateMotion id="kam9" begin="kap9.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 360.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam9.end"/></circle></g><animate id="kastart" begin="0s;kaend.end" attributeName="opacity" values="0;0;1" fill="freeze" dur="2s"/><animate id="kaend" begin="kad11.begin" attributeName="opacity" values="1;1;1;1;0" fill="freeze" dur="4s"/></svg>https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
<svg id="konigsberganimate" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="720" height="480" viewBox="0 0 720 480" style="background: lightblue; height: 414px; width: 886px;" opacity="0"><g class="appendarea"><circle cx="180.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="0"/><circle cx="360.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="1"/><circle cx="540.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="2"/><circle cx="90.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="3"/><circle cx="270.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="4"/><circle cx="450.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="5"/><circle cx="630.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="6"/><circle cx="180.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="7"/><circle cx="360.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="8"/><circle cx="540.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="9"/><path class="arrowbrg" d="M73,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 135,125.942)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 135,125.942" to="480 135,125.942" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 135,125.942" to="300 135,125.942" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="300 135,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 225,125.942)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 225,125.942" to="240 225,125.942" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 225,125.942" to="420 225,125.942" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 225,125.942" to="240 225,125.942" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 225,125.942" to="420 225,125.942" dur="1s" fill="freeze" begin="kam10.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="60 225,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 225,281.827)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 225,281.827" to="300 225,281.827" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 225,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 270,359.769)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 270,359.769" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 450,359.769)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,359.769" to="180 450,359.769" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,359.769" to="360 450,359.769" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 450,359.769" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 585,281.827)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 585,281.827" to="480 585,281.827" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 585,281.827" to="300 585,281.827" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 585,281.827" to="480 585,281.827" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="300 585,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 585,125.942)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 585,125.942" to="420 585,125.942" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 585,125.942" to="240 585,125.942" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 585,125.942" to="420 585,125.942" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="240 585,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M478,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 540,203.885)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 540,203.885" to="360 540,203.885" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 540,203.885" to="180 540,203.885" dur="1s" fill="freeze" begin="kam9.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 540,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 405,281.827)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 405,281.827" to="300 405,281.827" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 405,281.827" to="480 405,281.827" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 405,281.827" to="300 405,281.827" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 405,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 315,281.827)"><set attributeName="visibility" to="visible" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam2.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 315,281.827" to="420 315,281.827" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 315,281.827" to="240 315,281.827" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 315,281.827" to="420 315,281.827" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 315,281.827" to="240 315,281.827" dur="1s" fill="freeze" begin="kam8.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 315,281.827" to="420 315,281.827" dur="1s" fill="freeze" begin="kam10.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="240 315,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 495,281.827)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 495,281.827" to="240 495,281.827" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="60 495,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 450,48)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,48" to="360 450,48" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 450,48" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 270,48)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M118,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 180,203.885)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 315,125.942)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 405,125.942)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M73,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 135,281.827)"><set attributeName="visibility" to="visible" begin="kap7.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap7.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam7.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 495,125.942)"><set attributeName="visibility" to="visible" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M298,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 360,203.885)"><set attributeName="visibility" to="visible" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap8.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path></g><g class="bottomarea"><circle cx="90.00" cy="203.88" r="24" fill="#77d" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj0" to="white" begin="kastart.end+1s"/><set attributeName="visibility" to="hidden" begin="kam0.begin"/><set attributeName="visibility" to="visible" begin="kam0.end"/><set attributeName="cx" to="540.00" begin="kam0.end"/><set attributeName="cy" to="48.00" begin="kam0.end"/><set id="kad0" attributeName="stroke" to="none" begin="kam0.end+1.2s"/><set attributeName="stroke" id="kaj2" to="white" begin="kad1.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam2.begin"/><set attributeName="visibility" to="visible" begin="kam2.end"/><set attributeName="cx" to="180.00" begin="kam2.end"/><set attributeName="cy" to="48.00" begin="kam2.end"/><set id="kad2" attributeName="stroke" to="none" begin="kam2.end+1.2s"/><set attributeName="stroke" id="kaj4" to="white" begin="kad3.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam4.begin"/><set attributeName="visibility" to="visible" begin="kam4.end"/><set attributeName="cx" to="360.00" begin="kam4.end"/><set attributeName="cy" to="359.77" begin="kam4.end"/><set id="kad4" attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="stroke" id="kaj6" to="white" begin="kad5.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam6.begin"/><set attributeName="visibility" to="visible" begin="kam6.end"/><set attributeName="cx" to="540.00" begin="kam6.end"/><set attributeName="cy" to="48.00" begin="kam6.end"/><set id="kad6" attributeName="stroke" to="none" begin="kam6.end+1.2s"/><set attributeName="stroke" id="kaj8" to="white" begin="kad7.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam8.begin"/><set attributeName="visibility" to="visible" begin="kam8.end"/><set attributeName="cx" to="360.00" begin="kam8.end"/><set attributeName="cy" to="359.77" begin="kam8.end"/><set id="kad8" attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="stroke" id="kaj10" to="white" begin="kad9.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam10.begin"/><set attributeName="visibility" to="visible" begin="kam10.end"/><set attributeName="cx" to="180.00" begin="kam10.end"/><set attributeName="cy" to="48.00" begin="kam10.end"/><set id="kad10" attributeName="stroke" to="none" begin="kam10.end+1.2s"/><set attributeName="cx" to="90.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle><circle cx="630.00" cy="203.88" r="24" fill="#3d3" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj1" to="white" begin="kad0.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam1.begin"/><set attributeName="visibility" to="visible" begin="kam1.end"/><set attributeName="cx" to="180.00" begin="kam1.end"/><set attributeName="cy" to="359.77" begin="kam1.end"/><set id="kad1" attributeName="stroke" to="none" begin="kam1.end+1.2s"/><set attributeName="stroke" id="kaj3" to="white" begin="kad2.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam3.begin"/><set attributeName="visibility" to="visible" begin="kam3.end"/><set attributeName="cx" to="90.00" begin="kam3.end"/><set attributeName="cy" to="203.88" begin="kam3.end"/><set id="kad3" attributeName="stroke" to="none" begin="kam3.end+1.2s"/><set attributeName="stroke" id="kaj5" to="white" begin="kad4.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam5.begin"/><set attributeName="visibility" to="visible" begin="kam5.end"/><set attributeName="cx" to="180.00" begin="kam5.end"/><set attributeName="cy" to="359.77" begin="kam5.end"/><set id="kad5" attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="stroke" id="kaj7" to="white" begin="kad6.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam7.begin"/><set attributeName="visibility" to="visible" begin="kam7.end"/><set attributeName="cx" to="90.00" begin="kam7.end"/><set attributeName="cy" to="203.88" begin="kam7.end"/><set id="kad7" attributeName="stroke" to="none" begin="kam7.end+1.2s"/><set attributeName="stroke" id="kaj9" to="white" begin="kad8.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam9.begin"/><set attributeName="visibility" to="visible" begin="kam9.end"/><set attributeName="cx" to="630.00" begin="kam9.end"/><set attributeName="cy" to="203.88" begin="kam9.end"/><set id="kad9" attributeName="stroke" to="none" begin="kam9.end+1.2s"/><set attributeName="stroke" id="kaj11" to="white" begin="kad10.begin+1s"/><set attributeName="cx" to="630.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle></g><g class="middlearea" visibility="hidden"><line class="redline" x1="630.00" y1="203.88" x2="540.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="630.00" y1="203.88" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="540.00" y1="359.77" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="450.00" y1="203.88" x2="270.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="270.00" y1="203.88" x2="360.00" y2="48.00" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="270.00" y1="203.88" x2="360.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="48.00" x2="180.00" y2="48.00" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="48.00" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="359.77" x2="540.00" y2="359.77" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="360.00" y1="359.77" x2="450.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><line class="redline" x1="180.00" y1="48.00" x2="270.00" y2="203.88" stroke="#e77" stroke-width="7" stroke-linecap="round"/><set id="kad11" attributeName="visibility" to="visible" begin="kaj11.begin+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></g><path id="movingroute" class="route_tmp hide" d="M360,359.7691453623979 L 270,203.88457268119896 L 180,48 " fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4" stroke-dasharray="12 7" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="d" id="kap0" to="M 90.00,203.88 L 180.00,48.00 L 270.00,203.88 L 180.00,359.77 L 360.00,359.77 L 540.00,359.77 L 630.00,203.88 L 540.00,48.00" begin="kaj0.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap0.begin" end="kap0.end"/><set attributeName="d" id="kap1" to="M 630.00,203.88 L 450.00,203.88 L 360.00,359.77 L 180.00,359.77" begin="kaj1.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap1.begin" end="kap1.end"/><set attributeName="d" id="kap2" to="M 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 270.00,203.88 L 180.00,48.00" begin="kaj2.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap2.begin" end="kap2.end"/><set attributeName="d" id="kap3" to="M 180.00,359.77 L 360.00,359.77 L 450.00,203.88 L 540.00,359.77 L 630.00,203.88 L 540.00,48.00 L 360.00,48.00 L 180.00,48.00 L 90.00,203.88" begin="kaj3.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap3.begin" end="kap3.end"/><set attributeName="d" id="kap4" to="M 180.00,48.00 L 270.00,203.88 L 360.00,359.77" begin="kaj4.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap4.begin" end="kap4.end"/><set attributeName="d" id="kap5" to="M 90.00,203.88 L 270.00,203.88 L 360.00,48.00 L 450.00,203.88 L 360.00,359.77 L 180.00,359.77" begin="kaj5.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap5.begin" end="kap5.end"/><set attributeName="d" id="kap6" to="M 360.00,359.77 L 270.00,203.88 L 360.00,48.00 L 540.00,48.00" begin="kaj6.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap6.begin" end="kap6.end"/><set attributeName="d" id="kap7" to="M 180.00,359.77 L 90.00,203.88" begin="kaj7.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap7.begin" end="kap7.end"/><set attributeName="d" id="kap8" to="M 540.00,48.00 L 450.00,203.88 L 270.00,203.88 L 360.00,359.77" begin="kaj8.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap8.begin" end="kap8.end"/><set attributeName="d" id="kap9" to="M 90.00,203.88 L 270.00,203.88 L 360.00,48.00 L 450.00,203.88 L 630.00,203.88" begin="kaj9.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap9.begin" end="kap9.end"/><set attributeName="d" id="kap10" to="M 360.00,359.77 L 270.00,203.88 L 180.00,48.00" begin="kaj10.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap10.begin" end="kap10.end"/></path><g class="toparea"><circle cx="0" cy="0" r="24" fill="#77d" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam0.begin"/><animateMotion id="kam0" begin="kap0.end" dur="7s" fill="freeze" path="M 90.00,203.88 L 180.00,48.00 L 270.00,203.88 L 180.00,359.77 L 360.00,359.77 L 540.00,359.77 L 630.00,203.88 L 540.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam0.end"/><set attributeName="visibility" to="visible" begin="kam2.begin"/><animateMotion id="kam2" begin="kap2.end" dur="5s" fill="freeze" path="M 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 270.00,203.88 L 180.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam2.end"/><set attributeName="visibility" to="visible" begin="kam4.begin"/><animateMotion id="kam4" begin="kap4.end" dur="2s" fill="freeze" path="M 180.00,48.00 L 270.00,203.88 L 360.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam4.end"/><set attributeName="visibility" to="visible" begin="kam6.begin"/><animateMotion id="kam6" begin="kap6.end" dur="3s" fill="freeze" path="M 360.00,359.77 L 270.00,203.88 L 360.00,48.00 L 540.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam6.end"/><set attributeName="visibility" to="visible" begin="kam8.begin"/><animateMotion id="kam8" begin="kap8.end" dur="3s" fill="freeze" path="M 540.00,48.00 L 450.00,203.88 L 270.00,203.88 L 360.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam8.end"/><set attributeName="visibility" to="visible" begin="kam10.begin"/><animateMotion id="kam10" begin="kap10.end" dur="2s" fill="freeze" path="M 360.00,359.77 L 270.00,203.88 L 180.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam10.end"/></circle><circle cx="0" cy="0" r="24" fill="#3d3" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam1.begin"/><animateMotion id="kam1" begin="kap1.end" dur="3s" fill="freeze" path="M 630.00,203.88 L 450.00,203.88 L 360.00,359.77 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam1.end"/><set attributeName="visibility" to="visible" begin="kam3.begin"/><animateMotion id="kam3" begin="kap3.end" dur="8s" fill="freeze" path="M 180.00,359.77 L 360.00,359.77 L 450.00,203.88 L 540.00,359.77 L 630.00,203.88 L 540.00,48.00 L 360.00,48.00 L 180.00,48.00 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam3.end"/><set attributeName="visibility" to="visible" begin="kam5.begin"/><animateMotion id="kam5" begin="kap5.end" dur="5s" fill="freeze" path="M 90.00,203.88 L 270.00,203.88 L 360.00,48.00 L 450.00,203.88 L 360.00,359.77 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam5.end"/><set attributeName="visibility" to="visible" begin="kam7.begin"/><animateMotion id="kam7" begin="kap7.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam7.end"/><set attributeName="visibility" to="visible" begin="kam9.begin"/><animateMotion id="kam9" begin="kap9.end" dur="4s" fill="freeze" path="M 90.00,203.88 L 270.00,203.88 L 360.00,48.00 L 450.00,203.88 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam9.end"/></circle></g><animate id="kastart" begin="0s;kaend.end" attributeName="opacity" values="0;0;1" fill="freeze" dur="2s"/><animate id="kaend" begin="kad11.begin" attributeName="opacity" values="1;1;1;1;0" fill="freeze" dur="4s"/></svg>https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
為fullscreen也加個svg圖標,exportsvg也換一個圖標。另width和height不應為百分比,而是一個數字。
<div id="fullscreen"></div>
<div id="exportsvg" title="導出SVG動畫">
<svg viewBox="0 0 24 24" fill="white" width="60%" height="60%">
<path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/>
</svg>
</div>代码: 全选
<div id="fullscreen" title="全螢幕">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/>
</svg>
</div>
<div id="exportsvg" title="導出SVG動畫">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm4 18H6V4h7v5h5v11zM8 15.01l1.41 1.41L11 14.84V19h2v-4.16l1.59 1.59L16 15.01 12.01 11 8 15.01z"/>
</svg>
</div>https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
這是一個很好的需求。要體現「動畫」的含義,通常會在圖標中加入**播放感(Play)**、**序列感(Sequence)**或是**時鐘/時間(Time)**的元素。
以下為你設計了三套不同風格的方案,所有 SVG 的 `width` 與 `height` 均設定為數值 `24`。
---
### 方案一:動感軌跡風格 (Dynamic & Motion)
這套設計強調物體運動的「軌跡」。導出圖標結合了「文件」與「代表運動的波紋/路徑」。
* **Fullscreen**: 標準擴張型,線條較粗。
* **Export SVG**: 文件圖標內嵌一個帶有運動尾跡的圖形。
```html
<div id="fullscreen" title="全螢幕">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M5 5h5V3H3v7h2V5zm5 14H5v-5H3v7h7v-2zm9-5h-2v3h-3v2h5v-5zM14 3v2h3v3h2V3h-5z"/>
</svg>
</div>
<div id="exportsvg" title="導出SVG動畫">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 7V3.5L18.5 9H13z"/>
<path d="M8 12.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5S10.33 11 9.5 11 8 11.67 8 12.5zm5.5 0c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5S15.83 11 15 11s-1.5.67-1.5 1.5zM11 17h2v-2h-2v2z"/>
</svg>
</div>
```
---
### 方案二:播放時間軸風格 (Timeline & Play)
這套設計直接使用「播放」與「時間」的概念,最能直觀表達「這是會動的」。
* **Fullscreen**: 簡潔的四角標誌。
* **Export SVG**: 文件圖標加上一個**播放按鈕**與**環狀箭頭**,象徵循環動畫輸出。
```html
<div id="fullscreen" title="全螢幕">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M21 11V3h-8l3.29 3.29-5.73 5.73 1.42 1.42 5.72-5.73L21 11zM3 13v8h8l-3.29-3.29 5.73-5.73-1.42-1.42-5.72 5.73L3 13z"/>
</svg>
</div>
<div id="exportsvg" title="導出SVG動畫">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2z"/>
<path d="M13 3.5L18.5 9H13zM6 2c-1.1 0-2 .9-2 2v7h2V4h7v5h5v2h2V8l-6-6H6z"/>
<path d="M10 12.5l5 3-5 3v-6z"/>
</svg>
</div>
```
---
### 方案三:幀序列風格 (Frames & Sequence)
利用「膠卷」或「多重幀」的概念,體現動畫是由連續圖像構成的。
* **Fullscreen**: 實心背景塊狀感。
* **Export SVG**: 圖標看起來像是一疊文件(幀)正在被導出,並帶有箭頭。
```html
<div id="fullscreen" title="全螢幕">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M6 14c-1.1 0-2 .9-2 2v2c0 1.1.9 2 2 2h2v-2H6v-2h2v-2H6zm0-4h2V8h2V6H6c-1.1 0-2 .9-2 2v2zm12 8h-2v2h2c1.1 0 2-.9 2-2v-2h-2v2zm-2-12v2h2v2h2V8c0-1.1-.9-2-2-2h-2z"/>
</svg>
</div>
<div id="exportsvg" title="導出SVG動畫">
<svg viewBox="0 0 24 24" fill="white" width="24" height="24">
<path d="M2 4v12h2V4h12V2H4c-1.1 0-2 .9-2 2zm4 4v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2zm12 12H8V8h12v12zm-7-2h2v-3.58l1.59 1.59L18 14.59 14.01 10.6 10 14.59l1.41 1.41L13 14.42V18z"/>
</svg>
</div>
```
---
### 建議與說明:
1. **首選推薦**:如果是用於 Web 編輯器,**方案二**通常最能讓用戶一眼看出是「導出可播放的內容」。
2. **視覺一致性**:建議在一個頁面中,兩個圖標都選擇同一個方案裡的設計,這樣線條粗細(Stroke weight)和視覺風格才會和諧。
3. **顏色說明**:代碼中 `fill="white"` 是為了配合深色背景,如果你是淺色背景,請改為 `fill="currentColor"` 或指定的十六進位顏色。https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
給fullscreen和expsvg換上漂亮的圖標。
https://ejsoon.vip/wp-content/uploads/2 ... n7923.html
- 附件
-
konigsberg20260417fullaniicon7923.7z- (19.71 KiB) 已下载 11 次
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
為exportsvg加上hp不能小於1的判斷。
https://ejsoon.vip/wp-content/uploads/2 ... o7924.html
- 附件
-
konigsberg20260417hptwo7924.7z- (19.69 KiB) 已下载 12 次
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
給圖標加上max-height。
https://ejsoon.vip/wp-content/uploads/2 ... g7925.html
- 附件
-
konigsberg20260417expsvg7925.7z- (19.7 KiB) 已下载 14 次
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
只需給出所要修改的地方。
代码: 全选
沒問題,為了讓 AI 在面對「告負」(致命步或必敗步)時能優先選擇「放橋最多」的走法,我們可以在最終陣列排序 `moveStats.sort` 的常規比較區域加入平手時的判斷。由於 `rootState.empty_map` 在此作用域內是可讀取的,我們能直接計算該路徑會建立多少新橋。
請找到 `runMCTS` 函數中 `moveStats.sort` 的這段程式碼:
**原本的程式碼:**
```javascript
// 4. 【常規比較】:都不是絕對勝負的情況,依照 MCTS 模擬的勝率排序
let aWinRate = a.wins / a.plays;
let bWinRate = b.wins / b.plays;
return bWinRate - aWinRate;
});
```
**請將其修改為:**
```javascript
// 4. 【常規比較】:都不是絕對勝負的情況,依照 MCTS 模擬的勝率排序
let aWinRate = a.wins / a.plays;
let bWinRate = b.wins / b.plays;
if (aWinRate !== bWinRate) {
return bWinRate - aWinRate;
}
// 當勝率相同(例如都是告負的致命步 -999,或必敗步 -500)時,選擇放橋最多、步數最多的走法
let aBridges = 0, bBridges = 0;
for (let i = 0; i < a.move.length - 1; i++) {
if (rootState.empty_map[a.move[i]].indexOf(a.move[i+1]) > -1) aBridges++;
}
for (let i = 0; i < b.move.length - 1; i++) {
if (rootState.empty_map[b.move[i]].indexOf(b.move[i+1]) > -1) bBridges++;
}
if (aBridges !== bBridges) {
return bBridges - aBridges; // 降序:放橋多的優先
}
return b.move.length - a.move.length; // 若放橋數相同,則步數多的優先
});
```
這樣修改後,當 AI 評估多條路線都同樣面臨「必敗」或「致命」的結果時,就會啟動這層計數邏輯,優先選出能放下最多橋段(次之比較最多步數)的路線來走。https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
了解,若要限定只有在比較「致命步」(Immediate Loss)時才啟動放橋最多的判斷,我們可以在常規比較中加入 `a.immediateLoss && b.immediateLoss` 的條件。
請將 `moveStats.sort` 結尾的第 4 點常規比較區塊修改如下:
```javascript
// 4. 【常規比較】:都不是絕對勝負的情況,依照 MCTS 模擬的勝率排序
let aWinRate = a.wins / a.plays;
let bWinRate = b.wins / b.plays;
if (aWinRate !== bWinRate) {
return bWinRate - aWinRate;
}
// 只有在雙方都是「致命步」時,才優先選擇放橋最多、步數最多的走法
if (a.immediateLoss && b.immediateLoss) {
let aBridges = 0, bBridges = 0;
for (let i = 0; i < a.move.length - 1; i++) {
if (rootState.empty_map[a.move[i]].indexOf(a.move[i+1]) > -1) aBridges++;
}
for (let i = 0; i < b.move.length - 1; i++) {
if (rootState.empty_map[b.move[i]].indexOf(b.move[i+1]) > -1) bBridges++;
}
if (aBridges !== bBridges) {
return bBridges - aBridges; // 降序:放橋多的優先
}
return b.move.length - a.move.length; // 若放橋數相同,則步數多的優先
}
return 0; // 其他勝率相同的情況保持原序
});
```https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
如果AI只剩致命步時,則選擇放橋最多的走法。
https://ejsoon.vip/wp-content/uploads/2 ... g7926.html
- 附件
-
konigsberg20260417morebrg7926.7z- (19.92 KiB) 已下载 10 次
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
[[3,6],[-5,3,4,5,1,0],[0,6,4,3,5,4,1,5,0,1],[-5,6,5,8,4,7],[0,7,4,3,5,4,1,5,0,1,5,6,8,5,4,8,7,4],[-5,0,3,7,8,5,6],[6,7,4,3,5,4,1,5,0,1,6,5,5,8,4,8,7,4,3,0,7,3,8,7],[-5,7,3,0,1,2,6,5],[6,5,4,3,5,4,1,5,1,0,5,6,5,8,4,8,7,4,0,3,3,7,8,7,2,1,2,6],[-5,6,9,5,2,1],[1,5,4,3,5,4,1,5,1,0,5,6,5,8,4,8,7,4,0,3,3,7,8,7,1,2,2,6,6,9,9,5,5,2],[-5,5,2,6,9,8,7,4,1,0],[1,0,4,3,5,4,1,5,0,1,5,6,5,8,4,8,4,7,0,3,3,7,7,8,1,2,2,6,6,9,9,5,5,2,9,8,4,1],[-5,1,2,6,9,5,4,0,3],[3,0,4,3,4,5,1,5,0,1,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,0,1],[3,1,4,3,4,5,1,5,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,1,4,3,4,5,1,5,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,1,5,2],[7,2,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,2,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,2,6],[3,6,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,6,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,6,9,5],[7,5,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,5,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,5,2,1],[3,1,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,1,2,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,1,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,1,2,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,1,2,6,9],[7,9,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,9,4,3,4,5,5,1,1,0,5,6,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,9,5,6],[3,6,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,6,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,6,9,5],[7,5,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,5,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,5,1],[3,1,4,3,4,5,1,5,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,1,4,3,4,5,1,5,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,1,5,2,6,9],[7,9,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,9,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,9,5,2,1],[3,1,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,1,2,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,3,7],[7,1,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,1,2,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,1,2],[7,2,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,7,3,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-5,7,3],[3,2,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0],[-4,2,6],[3,6,4,3,4,5,5,1,1,0,6,5,5,8,4,8,4,7,3,0,3,7,7,8,2,1,2,6,6,9,9,5,5,2,9,8,4,1,4,0]]代码: 全选
<svg id="konigsberganimate" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="720" height="480" viewBox="0 0 720 480" style="background: lightblue; height: 100%; width: 100%;" opacity="0"><g class="appendarea"><circle cx="180.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="0"/><circle cx="360.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="1"/><circle cx="540.00" cy="48.00" r="24" fill="#fff" stroke="#333" stroke-width="2" i="2"/><circle cx="90.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="3"/><circle cx="270.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="4"/><circle cx="450.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="5"/><circle cx="630.00" cy="203.88" r="24" fill="#fff" stroke="#333" stroke-width="2" i="6"/><circle cx="180.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="7"/><circle cx="360.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="8"/><circle cx="540.00" cy="359.77" r="24" fill="#fff" stroke="#333" stroke-width="2" i="9"/><path class="arrowbrg" d="M118,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 180,203.885)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 180,203.885" to="180 180,203.885" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 180,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M298,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 360,203.885)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 360,203.885" to="180 360,203.885" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 360,203.885" to="360 360,203.885" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 360,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 405,125.942)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 405,125.942" to="420 405,125.942" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 405,125.942" to="240 405,125.942" dur="1s" fill="freeze" begin="kam9.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 405,125.942" to="420 405,125.942" dur="1s" fill="freeze" begin="kam23.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 405,125.942" to="240 405,125.942" dur="1s" fill="freeze" begin="kam25.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="240 405,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 270,48)"><set attributeName="visibility" to="visible" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap0.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam0.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,48" to="360 270,48" dur="1s" fill="freeze" begin="kam0.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,48" to="180 270,48" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,48" to="360 270,48" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,48" to="180 270,48" dur="1s" fill="freeze" begin="kam7.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 270,48" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M478,203.88457268119896 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 540,203.885)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 540,203.885" to="360 540,203.885" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 540,203.885" to="180 540,203.885" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 540,203.885" to="360 540,203.885" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 540,203.885" to="180 540,203.885" dur="1s" fill="freeze" begin="kam19.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="180 540,203.885" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M343,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 405,281.827)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 405,281.827" to="300 405,281.827" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 405,281.827" to="480 405,281.827" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 405,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 315,281.827)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 315,281.827" to="420 315,281.827" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="240 315,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 225,281.827)"><set attributeName="visibility" to="visible" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap1.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam1.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 225,281.827" to="300 225,281.827" dur="1s" fill="freeze" begin="kam1.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 225,281.827" to="480 225,281.827" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 225,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M73,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 135,125.942)"><set attributeName="visibility" to="visible" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam2.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 135,125.942" to="300 135,125.942" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="300 135,125.942" to="480 135,125.942" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="120 135,125.942" to="300 135,125.942" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="120 135,125.942" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M73,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 135,281.827)"><set attributeName="visibility" to="visible" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam2.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam8.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam10.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam12.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam14.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam16.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam18.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam20.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam22.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam24.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam26.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="60 135,281.827" to="240 135,281.827" dur="1s" fill="freeze" begin="kam28.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="240 135,281.827" to="420 135,281.827" dur="1s" fill="freeze" begin="kam30.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="60 135,281.827" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M208,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 270,359.769)"><set attributeName="visibility" to="visible" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap2.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam2.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 270,359.769" to="180 270,359.769" dur="1s" fill="freeze" begin="kam2.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 270,359.769" to="360 270,359.769" dur="1s" fill="freeze" begin="kam5.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 270,359.769" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,48 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#C19A6B" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(0 450,48)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam3.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,48" to="360 450,48" dur="1s" fill="freeze" begin="kam4.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam6.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,48" to="360 450,48" dur="1s" fill="freeze" begin="kam15.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam17.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="180 450,48" to="360 450,48" dur="1s" fill="freeze" begin="kam27.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 450,48" to="180 450,48" dur="1s" fill="freeze" begin="kam29.end"/><animateTransform attributeName="transform" attributeType="XML" type="rotate" to="0 450,48" dur="1s" fill="freeze" begin="kaend.end"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(60 585,125.942)"><set attributeName="visibility" to="visible" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap3.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam3.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M523,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(120 585,281.827)"><set attributeName="visibility" to="visible" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,281.82685902179844 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 495,281.827)"><set attributeName="visibility" to="visible" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M433,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 495,125.942)"><set attributeName="visibility" to="visible" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap4.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M388,359.7691453623979 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(180 450,359.769)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M253,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(300 315,125.942)"><set attributeName="visibility" to="visible" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap5.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path><path class="arrowbrg" d="M163,125.94228634059948 v -12 h 100 v -12 l 24 24 l -24 24 v -12 h -100 Z" fill="#708090" stroke="none" stroke-width="2" visibility="hidden" transform="rotate(240 225,125.942)"><set attributeName="visibility" to="visible" begin="kap6.begin+0.36s"/><set attributeName="stroke" to="#333" begin="kap6.begin+0.36s"/><set attributeName="stroke" to="none" begin="kam6.end+1.2s"/><set attributeName="visibility" to="hidden" begin="kaend.end"/></path></g><g class="bottomarea"><circle cx="90.00" cy="203.88" r="24" fill="#77d" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj0" to="white" begin="kastart.end+1s"/><set attributeName="visibility" to="hidden" begin="kam0.begin"/><set attributeName="visibility" to="visible" begin="kam0.end"/><set attributeName="cx" to="180.00" begin="kam0.end"/><set attributeName="cy" to="48.00" begin="kam0.end"/><set id="kad0" attributeName="stroke" to="none" begin="kam0.end+1.2s"/><set attributeName="stroke" id="kaj2" to="white" begin="kad1.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam2.begin"/><set attributeName="visibility" to="visible" begin="kam2.end"/><set attributeName="cx" to="630.00" begin="kam2.end"/><set attributeName="cy" to="203.88" begin="kam2.end"/><set id="kad2" attributeName="stroke" to="none" begin="kam2.end+1.2s"/><set attributeName="stroke" id="kaj4" to="white" begin="kad3.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam4.begin"/><set attributeName="visibility" to="visible" begin="kam4.end"/><set attributeName="cx" to="360.00" begin="kam4.end"/><set attributeName="cy" to="48.00" begin="kam4.end"/><set id="kad4" attributeName="stroke" to="none" begin="kam4.end+1.2s"/><set attributeName="stroke" id="kaj6" to="white" begin="kad5.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam6.begin"/><set attributeName="visibility" to="visible" begin="kam6.end"/><set attributeName="cx" to="90.00" begin="kam6.end"/><set attributeName="cy" to="203.88" begin="kam6.end"/><set id="kad6" attributeName="stroke" to="none" begin="kam6.end+1.2s"/><set attributeName="stroke" id="kaj8" to="white" begin="kad7.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam8.begin"/><set attributeName="visibility" to="visible" begin="kam8.end"/><set attributeName="cx" to="180.00" begin="kam8.end"/><set attributeName="cy" to="359.77" begin="kam8.end"/><set id="kad8" attributeName="stroke" to="none" begin="kam8.end+1.2s"/><set attributeName="stroke" id="kaj10" to="white" begin="kad9.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam10.begin"/><set attributeName="visibility" to="visible" begin="kam10.end"/><set attributeName="cx" to="90.00" begin="kam10.end"/><set attributeName="cy" to="203.88" begin="kam10.end"/><set id="kad10" attributeName="stroke" to="none" begin="kam10.end+1.2s"/><set attributeName="stroke" id="kaj12" to="white" begin="kad11.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam12.begin"/><set attributeName="visibility" to="visible" begin="kam12.end"/><set attributeName="cx" to="180.00" begin="kam12.end"/><set attributeName="cy" to="359.77" begin="kam12.end"/><set id="kad12" attributeName="stroke" to="none" begin="kam12.end+1.2s"/><set attributeName="stroke" id="kaj14" to="white" begin="kad13.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam14.begin"/><set attributeName="visibility" to="visible" begin="kam14.end"/><set attributeName="cx" to="90.00" begin="kam14.end"/><set attributeName="cy" to="203.88" begin="kam14.end"/><set id="kad14" attributeName="stroke" to="none" begin="kam14.end+1.2s"/><set attributeName="stroke" id="kaj16" to="white" begin="kad15.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam16.begin"/><set attributeName="visibility" to="visible" begin="kam16.end"/><set attributeName="cx" to="180.00" begin="kam16.end"/><set attributeName="cy" to="359.77" begin="kam16.end"/><set id="kad16" attributeName="stroke" to="none" begin="kam16.end+1.2s"/><set attributeName="stroke" id="kaj18" to="white" begin="kad17.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam18.begin"/><set attributeName="visibility" to="visible" begin="kam18.end"/><set attributeName="cx" to="90.00" begin="kam18.end"/><set attributeName="cy" to="203.88" begin="kam18.end"/><set id="kad18" attributeName="stroke" to="none" begin="kam18.end+1.2s"/><set attributeName="stroke" id="kaj20" to="white" begin="kad19.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam20.begin"/><set attributeName="visibility" to="visible" begin="kam20.end"/><set attributeName="cx" to="180.00" begin="kam20.end"/><set attributeName="cy" to="359.77" begin="kam20.end"/><set id="kad20" attributeName="stroke" to="none" begin="kam20.end+1.2s"/><set attributeName="stroke" id="kaj22" to="white" begin="kad21.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam22.begin"/><set attributeName="visibility" to="visible" begin="kam22.end"/><set attributeName="cx" to="90.00" begin="kam22.end"/><set attributeName="cy" to="203.88" begin="kam22.end"/><set id="kad22" attributeName="stroke" to="none" begin="kam22.end+1.2s"/><set attributeName="stroke" id="kaj24" to="white" begin="kad23.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam24.begin"/><set attributeName="visibility" to="visible" begin="kam24.end"/><set attributeName="cx" to="180.00" begin="kam24.end"/><set attributeName="cy" to="359.77" begin="kam24.end"/><set id="kad24" attributeName="stroke" to="none" begin="kam24.end+1.2s"/><set attributeName="stroke" id="kaj26" to="white" begin="kad25.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam26.begin"/><set attributeName="visibility" to="visible" begin="kam26.end"/><set attributeName="cx" to="90.00" begin="kam26.end"/><set attributeName="cy" to="203.88" begin="kam26.end"/><set id="kad26" attributeName="stroke" to="none" begin="kam26.end+1.2s"/><set attributeName="stroke" id="kaj28" to="white" begin="kad27.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam28.begin"/><set attributeName="visibility" to="visible" begin="kam28.end"/><set attributeName="cx" to="180.00" begin="kam28.end"/><set attributeName="cy" to="359.77" begin="kam28.end"/><set id="kad28" attributeName="stroke" to="none" begin="kam28.end+1.2s"/><set attributeName="stroke" id="kaj30" to="white" begin="kad29.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam30.begin"/><set attributeName="visibility" to="visible" begin="kam30.end"/><set attributeName="cx" to="90.00" begin="kam30.end"/><set attributeName="cy" to="203.88" begin="kam30.end"/><set id="kad30" attributeName="stroke" to="none" begin="kam30.end+1.2s"/><set id="kad31" attributeName="stroke" to="#e77" begin="kam31.end+1.2s"/><set attributeName="cx" to="90.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle><circle cx="630.00" cy="203.88" r="24" fill="#3d3" stroke="none" stroke-width="4"><set attributeName="stroke" id="kaj1" to="white" begin="kad0.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam1.begin"/><set attributeName="visibility" to="visible" begin="kam1.end"/><set attributeName="cx" to="180.00" begin="kam1.end"/><set attributeName="cy" to="359.77" begin="kam1.end"/><set id="kad1" attributeName="stroke" to="none" begin="kam1.end+1.2s"/><set attributeName="stroke" id="kaj3" to="white" begin="kad2.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam3.begin"/><set attributeName="visibility" to="visible" begin="kam3.end"/><set attributeName="cx" to="450.00" begin="kam3.end"/><set attributeName="cy" to="203.88" begin="kam3.end"/><set id="kad3" attributeName="stroke" to="none" begin="kam3.end+1.2s"/><set attributeName="stroke" id="kaj5" to="white" begin="kad4.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam5.begin"/><set attributeName="visibility" to="visible" begin="kam5.end"/><set attributeName="cx" to="180.00" begin="kam5.end"/><set attributeName="cy" to="48.00" begin="kam5.end"/><set id="kad5" attributeName="stroke" to="none" begin="kam5.end+1.2s"/><set attributeName="stroke" id="kaj7" to="white" begin="kad6.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam7.begin"/><set attributeName="visibility" to="visible" begin="kam7.end"/><set attributeName="cx" to="360.00" begin="kam7.end"/><set attributeName="cy" to="48.00" begin="kam7.end"/><set id="kad7" attributeName="stroke" to="none" begin="kam7.end+1.2s"/><set attributeName="stroke" id="kaj9" to="white" begin="kad8.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam9.begin"/><set attributeName="visibility" to="visible" begin="kam9.end"/><set attributeName="cx" to="540.00" begin="kam9.end"/><set attributeName="cy" to="48.00" begin="kam9.end"/><set id="kad9" attributeName="stroke" to="none" begin="kam9.end+1.2s"/><set attributeName="stroke" id="kaj11" to="white" begin="kad10.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam11.begin"/><set attributeName="visibility" to="visible" begin="kam11.end"/><set attributeName="cx" to="630.00" begin="kam11.end"/><set attributeName="cy" to="203.88" begin="kam11.end"/><set id="kad11" attributeName="stroke" to="none" begin="kam11.end+1.2s"/><set attributeName="stroke" id="kaj13" to="white" begin="kad12.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam13.begin"/><set attributeName="visibility" to="visible" begin="kam13.end"/><set attributeName="cx" to="450.00" begin="kam13.end"/><set attributeName="cy" to="203.88" begin="kam13.end"/><set id="kad13" attributeName="stroke" to="none" begin="kam13.end+1.2s"/><set attributeName="stroke" id="kaj15" to="white" begin="kad14.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam15.begin"/><set attributeName="visibility" to="visible" begin="kam15.end"/><set attributeName="cx" to="360.00" begin="kam15.end"/><set attributeName="cy" to="48.00" begin="kam15.end"/><set id="kad15" attributeName="stroke" to="none" begin="kam15.end+1.2s"/><set attributeName="stroke" id="kaj17" to="white" begin="kad16.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam17.begin"/><set attributeName="visibility" to="visible" begin="kam17.end"/><set attributeName="cx" to="540.00" begin="kam17.end"/><set attributeName="cy" to="359.77" begin="kam17.end"/><set id="kad17" attributeName="stroke" to="none" begin="kam17.end+1.2s"/><set attributeName="stroke" id="kaj19" to="white" begin="kad18.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam19.begin"/><set attributeName="visibility" to="visible" begin="kam19.end"/><set attributeName="cx" to="630.00" begin="kam19.end"/><set attributeName="cy" to="203.88" begin="kam19.end"/><set id="kad19" attributeName="stroke" to="none" begin="kam19.end+1.2s"/><set attributeName="stroke" id="kaj21" to="white" begin="kad20.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam21.begin"/><set attributeName="visibility" to="visible" begin="kam21.end"/><set attributeName="cx" to="450.00" begin="kam21.end"/><set attributeName="cy" to="203.88" begin="kam21.end"/><set id="kad21" attributeName="stroke" to="none" begin="kam21.end+1.2s"/><set attributeName="stroke" id="kaj23" to="white" begin="kad22.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam23.begin"/><set attributeName="visibility" to="visible" begin="kam23.end"/><set attributeName="cx" to="360.00" begin="kam23.end"/><set attributeName="cy" to="48.00" begin="kam23.end"/><set id="kad23" attributeName="stroke" to="none" begin="kam23.end+1.2s"/><set attributeName="stroke" id="kaj25" to="white" begin="kad24.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam25.begin"/><set attributeName="visibility" to="visible" begin="kam25.end"/><set attributeName="cx" to="540.00" begin="kam25.end"/><set attributeName="cy" to="359.77" begin="kam25.end"/><set id="kad25" attributeName="stroke" to="none" begin="kam25.end+1.2s"/><set attributeName="stroke" id="kaj27" to="white" begin="kad26.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam27.begin"/><set attributeName="visibility" to="visible" begin="kam27.end"/><set attributeName="cx" to="360.00" begin="kam27.end"/><set attributeName="cy" to="48.00" begin="kam27.end"/><set id="kad27" attributeName="stroke" to="none" begin="kam27.end+1.2s"/><set attributeName="stroke" id="kaj29" to="white" begin="kad28.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam29.begin"/><set attributeName="visibility" to="visible" begin="kam29.end"/><set attributeName="cx" to="540.00" begin="kam29.end"/><set attributeName="cy" to="48.00" begin="kam29.end"/><set id="kad29" attributeName="stroke" to="none" begin="kam29.end+1.2s"/><set attributeName="stroke" id="kaj31" to="white" begin="kad30.begin+1s"/><set attributeName="visibility" to="hidden" begin="kam31.begin"/><set attributeName="visibility" to="visible" begin="kam31.end"/><set attributeName="cx" to="630.00" begin="kam31.end"/><set attributeName="cy" to="203.88" begin="kam31.end"/><set id="kad31_1" attributeName="stroke" to="#e77" begin="kam31.end+1.2s"/><set attributeName="cx" to="630.00" begin="kaend.end"/><set attributeName="cy" to="203.88" begin="kaend.end"/><set attributeName="stroke" to="none" begin="kaend.end"/></circle></g><g class="middlearea" visibility="hidden"><set attributeName="visibility" to="hidden" begin="kaend.end"/></g><path id="movingroute" class="route_tmp hide" d="M540,48 L 630,203.88457268119896 " fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4" stroke-dasharray="12 7" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="d" id="kap0" to="M 90.00,203.88 L 270.00,203.88 L 450.00,203.88 L 360.00,48.00 L 180.00,48.00" begin="kaj0.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap0.begin" end="kap0.end"/><set attributeName="d" id="kap1" to="M 630.00,203.88 L 450.00,203.88 L 360.00,359.77 L 270.00,203.88 L 180.00,359.77" begin="kaj1.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap1.begin" end="kap1.end"/><set attributeName="d" id="kap2" to="M 180.00,48.00 L 90.00,203.88 L 180.00,359.77 L 360.00,359.77 L 450.00,203.88 L 630.00,203.88" begin="kaj2.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap2.begin" end="kap2.end"/><set attributeName="d" id="kap3" to="M 180.00,359.77 L 90.00,203.88 L 180.00,48.00 L 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 450.00,203.88" begin="kaj3.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap3.begin" end="kap3.end"/><set attributeName="d" id="kap4" to="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00" begin="kaj4.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap4.begin" end="kap4.end"/><set attributeName="d" id="kap5" to="M 450.00,203.88 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 180.00,359.77 L 270.00,203.88 L 360.00,48.00 L 180.00,48.00" begin="kaj5.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap5.begin" end="kap5.end"/><set attributeName="d" id="kap6" to="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 450.00,203.88 L 270.00,203.88 L 180.00,48.00 L 90.00,203.88" begin="kaj6.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap6.begin" end="kap6.end"/><set attributeName="d" id="kap7" to="M 180.00,48.00 L 360.00,48.00" begin="kaj7.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap7.begin" end="kap7.end"/><set attributeName="d" id="kap8" to="M 90.00,203.88 L 180.00,359.77" begin="kaj8.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap8.begin" end="kap8.end"/><set attributeName="d" id="kap9" to="M 360.00,48.00 L 450.00,203.88 L 540.00,48.00" begin="kaj9.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap9.begin" end="kap9.end"/><set attributeName="d" id="kap10" to="M 180.00,359.77 L 90.00,203.88" begin="kaj10.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap10.begin" end="kap10.end"/><set attributeName="d" id="kap11" to="M 540.00,48.00 L 630.00,203.88" begin="kaj11.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap11.begin" end="kap11.end"/><set attributeName="d" id="kap12" to="M 90.00,203.88 L 180.00,359.77" begin="kaj12.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap12.begin" end="kap12.end"/><set attributeName="d" id="kap13" to="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88" begin="kaj13.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap13.begin" end="kap13.end"/><set attributeName="d" id="kap14" to="M 180.00,359.77 L 90.00,203.88" begin="kaj14.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap14.begin" end="kap14.end"/><set attributeName="d" id="kap15" to="M 450.00,203.88 L 540.00,48.00 L 360.00,48.00" begin="kaj15.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap15.begin" end="kap15.end"/><set attributeName="d" id="kap16" to="M 90.00,203.88 L 180.00,359.77" begin="kaj16.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap16.begin" end="kap16.end"/><set attributeName="d" id="kap17" to="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77" begin="kaj17.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap17.begin" end="kap17.end"/><set attributeName="d" id="kap18" to="M 180.00,359.77 L 90.00,203.88" begin="kaj18.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap18.begin" end="kap18.end"/><set attributeName="d" id="kap19" to="M 540.00,359.77 L 450.00,203.88 L 630.00,203.88" begin="kaj19.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap19.begin" end="kap19.end"/><set attributeName="d" id="kap20" to="M 90.00,203.88 L 180.00,359.77" begin="kaj20.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap20.begin" end="kap20.end"/><set attributeName="d" id="kap21" to="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88" begin="kaj21.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap21.begin" end="kap21.end"/><set attributeName="d" id="kap22" to="M 180.00,359.77 L 90.00,203.88" begin="kaj22.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap22.begin" end="kap22.end"/><set attributeName="d" id="kap23" to="M 450.00,203.88 L 360.00,48.00" begin="kaj23.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap23.begin" end="kap23.end"/><set attributeName="d" id="kap24" to="M 90.00,203.88 L 180.00,359.77" begin="kaj24.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap24.begin" end="kap24.end"/><set attributeName="d" id="kap25" to="M 360.00,48.00 L 450.00,203.88 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77" begin="kaj25.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap25.begin" end="kap25.end"/><set attributeName="d" id="kap26" to="M 180.00,359.77 L 90.00,203.88" begin="kaj26.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap26.begin" end="kap26.end"/><set attributeName="d" id="kap27" to="M 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00" begin="kaj27.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap27.begin" end="kap27.end"/><set attributeName="d" id="kap28" to="M 90.00,203.88 L 180.00,359.77" begin="kaj28.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap28.begin" end="kap28.end"/><set attributeName="d" id="kap29" to="M 360.00,48.00 L 540.00,48.00" begin="kaj29.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap29.begin" end="kap29.end"/><set attributeName="d" id="kap30" to="M 180.00,359.77 L 90.00,203.88" begin="kaj30.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap30.begin" end="kap30.end"/><set attributeName="d" id="kap31" to="M 540.00,48.00 L 630.00,203.88" begin="kaj31.begin+1s" dur="1s"/><set attributeName="visibility" to="visible" begin="kap31.begin" end="kap31.end"/></path><g class="toparea"><circle cx="0" cy="0" r="24" fill="#77d" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam0.begin"/><animateMotion id="kam0" begin="kap0.end" dur="4s" fill="freeze" path="M 90.00,203.88 L 270.00,203.88 L 450.00,203.88 L 360.00,48.00 L 180.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam0.end"/><set attributeName="visibility" to="visible" begin="kam2.begin"/><animateMotion id="kam2" begin="kap2.end" dur="5s" fill="freeze" path="M 180.00,48.00 L 90.00,203.88 L 180.00,359.77 L 360.00,359.77 L 450.00,203.88 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam2.end"/><set attributeName="visibility" to="visible" begin="kam4.begin"/><animateMotion id="kam4" begin="kap4.end" dur="4s" fill="freeze" path="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam4.end"/><set attributeName="visibility" to="visible" begin="kam6.begin"/><animateMotion id="kam6" begin="kap6.end" dur="7s" fill="freeze" path="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 450.00,203.88 L 270.00,203.88 L 180.00,48.00 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam6.end"/><set attributeName="visibility" to="visible" begin="kam8.begin"/><animateMotion id="kam8" begin="kap8.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam8.end"/><set attributeName="visibility" to="visible" begin="kam10.begin"/><animateMotion id="kam10" begin="kap10.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam10.end"/><set attributeName="visibility" to="visible" begin="kam12.begin"/><animateMotion id="kam12" begin="kap12.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam12.end"/><set attributeName="visibility" to="visible" begin="kam14.begin"/><animateMotion id="kam14" begin="kap14.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam14.end"/><set attributeName="visibility" to="visible" begin="kam16.begin"/><animateMotion id="kam16" begin="kap16.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam16.end"/><set attributeName="visibility" to="visible" begin="kam18.begin"/><animateMotion id="kam18" begin="kap18.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam18.end"/><set attributeName="visibility" to="visible" begin="kam20.begin"/><animateMotion id="kam20" begin="kap20.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam20.end"/><set attributeName="visibility" to="visible" begin="kam22.begin"/><animateMotion id="kam22" begin="kap22.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam22.end"/><set attributeName="visibility" to="visible" begin="kam24.begin"/><animateMotion id="kam24" begin="kap24.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam24.end"/><set attributeName="visibility" to="visible" begin="kam26.begin"/><animateMotion id="kam26" begin="kap26.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam26.end"/><set attributeName="visibility" to="visible" begin="kam28.begin"/><animateMotion id="kam28" begin="kap28.end" dur="1s" fill="freeze" path="M 90.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam28.end"/><set attributeName="visibility" to="visible" begin="kam30.begin"/><animateMotion id="kam30" begin="kap30.end" dur="1s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam30.end"/></circle><circle cx="0" cy="0" r="24" fill="#3d3" stroke="lightyellow" stroke-width="4" stroke-dasharray="5 5" visibility="hidden"><animate class="dashoffset" attributeName="stroke-dashoffset" values="0;-24000" repeatCount="indefinite" dur="777s"/><set attributeName="visibility" to="visible" begin="kam1.begin"/><animateMotion id="kam1" begin="kap1.end" dur="4s" fill="freeze" path="M 630.00,203.88 L 450.00,203.88 L 360.00,359.77 L 270.00,203.88 L 180.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam1.end"/><set attributeName="visibility" to="visible" begin="kam3.begin"/><animateMotion id="kam3" begin="kap3.end" dur="6s" fill="freeze" path="M 180.00,359.77 L 90.00,203.88 L 180.00,48.00 L 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 450.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam3.end"/><set attributeName="visibility" to="visible" begin="kam5.begin"/><animateMotion id="kam5" begin="kap5.end" dur="8s" fill="freeze" path="M 450.00,203.88 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77 L 360.00,359.77 L 180.00,359.77 L 270.00,203.88 L 360.00,48.00 L 180.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam5.end"/><set attributeName="visibility" to="visible" begin="kam7.begin"/><animateMotion id="kam7" begin="kap7.end" dur="1s" fill="freeze" path="M 180.00,48.00 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam7.end"/><set attributeName="visibility" to="visible" begin="kam9.begin"/><animateMotion id="kam9" begin="kap9.end" dur="2s" fill="freeze" path="M 360.00,48.00 L 450.00,203.88 L 540.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam9.end"/><set attributeName="visibility" to="visible" begin="kam11.begin"/><animateMotion id="kam11" begin="kap11.end" dur="1s" fill="freeze" path="M 540.00,48.00 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam11.end"/><set attributeName="visibility" to="visible" begin="kam13.begin"/><animateMotion id="kam13" begin="kap13.end" dur="2s" fill="freeze" path="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam13.end"/><set attributeName="visibility" to="visible" begin="kam15.begin"/><animateMotion id="kam15" begin="kap15.end" dur="2s" fill="freeze" path="M 450.00,203.88 L 540.00,48.00 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam15.end"/><set attributeName="visibility" to="visible" begin="kam17.begin"/><animateMotion id="kam17" begin="kap17.end" dur="3s" fill="freeze" path="M 360.00,48.00 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam17.end"/><set attributeName="visibility" to="visible" begin="kam19.begin"/><animateMotion id="kam19" begin="kap19.end" dur="2s" fill="freeze" path="M 540.00,359.77 L 450.00,203.88 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam19.end"/><set attributeName="visibility" to="visible" begin="kam21.begin"/><animateMotion id="kam21" begin="kap21.end" dur="2s" fill="freeze" path="M 630.00,203.88 L 540.00,359.77 L 450.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam21.end"/><set attributeName="visibility" to="visible" begin="kam23.begin"/><animateMotion id="kam23" begin="kap23.end" dur="1s" fill="freeze" path="M 450.00,203.88 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam23.end"/><set attributeName="visibility" to="visible" begin="kam25.begin"/><animateMotion id="kam25" begin="kap25.end" dur="4s" fill="freeze" path="M 360.00,48.00 L 450.00,203.88 L 540.00,48.00 L 630.00,203.88 L 540.00,359.77"/><set attributeName="visibility" to="hidden" begin="kam25.end"/><set attributeName="visibility" to="visible" begin="kam27.begin"/><animateMotion id="kam27" begin="kap27.end" dur="3s" fill="freeze" path="M 540.00,359.77 L 450.00,203.88 L 540.00,48.00 L 360.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam27.end"/><set attributeName="visibility" to="visible" begin="kam29.begin"/><animateMotion id="kam29" begin="kap29.end" dur="1s" fill="freeze" path="M 360.00,48.00 L 540.00,48.00"/><set attributeName="visibility" to="hidden" begin="kam29.end"/><set attributeName="visibility" to="visible" begin="kam31.begin"/><animateMotion id="kam31" begin="kap31.end" dur="1s" fill="freeze" path="M 540.00,48.00 L 630.00,203.88"/><set attributeName="visibility" to="hidden" begin="kam31.end"/></circle></g><animate id="kastart" begin="0s;kaend.end" attributeName="opacity" values="0;0;1" fill="freeze" dur="2s"/><animate id="kaend" begin="kad31.begin" attributeName="opacity" values="1;1;1;1;0" fill="freeze" dur="4s"/></svg>
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
Re: 改下哥尼斯堡網頁程式
代码: 全选
沒問題,我們只需要修改 HTML 中 `#setting_close` 的內容,以及 JavaScript 裡控制設定介面開關的函數。
以下是需要修改的兩個地方:
### 1. 替換關閉按鈕的 HTML
請在 `<body>` 裡找到 `#setting_div` 的區塊,把原先純文字的 `X` 換成 SVG 標籤。
**原來的程式碼:**
```html
<div id="setting_div" class="hide">
<textarea id="setting_text"></textarea>
<div id="setting_close">X</div>
</div>
```
**請將其修改為:**
```html
<div id="setting_div" class="hide">
<textarea id="setting_text"></textarea>
<div id="setting_close" title="關閉">
<svg viewBox="0 0 24 24" fill="white" width="18" height="18" style="vertical-align: middle; margin-top: -2px;">
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
</svg>
</div>
</div>
```
---
### 2. 在打開 History 時關閉 Modal
請在 JavaScript 中找到負責開關 History 的 `setting_close.onclick = btn_history_set.onclick` 函數,在展開介面時呼叫 `closeMctsModal()`。
**原來的程式碼:**
```javascript
// show and set history
setting_close.onclick = btn_history_set.onclick = function() {
if (isMctsRunning && this === btn_history_set) return; // 搜尋中禁止點擊設定鈕
let game_history_parse = [];
for (let x = 0; x < game_history.length; x++) {
game_history_parse.push(JSON.parse(game_history[x]));
}
let game_history_str = JSON.stringify(game_history_parse);
if (setting_div.classList.contains("hide")) {
setting_div.classList.remove("hide");
setting_text.value = game_history_str;
setting_text.select();
} else {
```
**請將其修改為:**
```javascript
// show and set history
setting_close.onclick = btn_history_set.onclick = function() {
if (isMctsRunning && this === btn_history_set) return; // 搜尋中禁止點擊設定鈕
let game_history_parse = [];
for (let x = 0; x < game_history.length; x++) {
game_history_parse.push(JSON.parse(game_history[x]));
}
let game_history_str = JSON.stringify(game_history_parse);
if (setting_div.classList.contains("hide")) {
// 如果 MCTS Modal 存在(顯示中),則將其關閉
if (document.getElementById('mcts_modal').style.display === 'block') {
closeMctsModal();
}
setting_div.classList.remove("hide");
setting_text.value = game_history_str;
setting_text.select();
} else {
```https://ejsoon.vip/
弈趣極光:享受思維樂趣
弈趣極光:享受思維樂趣
在线用户
正浏览此版面之用户: Majestic-12 [Bot] 和 2 访客
