пользовательский значок не отображается в железном значке

Я пытаюсь использовать пользовательский значок svg в элементе iron-icon, но он не отображается. Все стандартные иконки от iron-iconset работают отлично. Я подключил все необходимые библиотеки полимеров, но это все еще не решило мою проблему.

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/iron-icons/iron-icons.html">
<link rel="import" href="../bower_components/iron-icons/av-icons.html">
<link rel="import" href="../bower_components/iron-icons/social-icons.html">
<link rel="import" href="../bower_components/iron-icons/image-icons.html">
<link rel="import" href="../bower_components/iron-image/iron-image.html">
<link rel="import" href="../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../bower_components/iron-iconset-svg/iron-iconset-svg.html">
<link rel="import" href="custom-icon.html">

<iron-icon icon="custom-icon:my-icon"></iron-icon>

вот custom-icon.html

<link rel="import" href="../js/bower_components/iron-icon/iron-icon.html">
<link rel="import" href="../js/bower_components/iron-iconset-svg/iron-iconset-svg.html">

<iron-iconset-svg name="custom" size=4>
    <svg>
        <defs>
            <g id="nodejs">
                <path d="M116.504151,3.58037736 C123.46566,-0.404528302...
            </g>
</iron-iconset-svg>

Может ли кто-нибудь помочь мне решить эту проблему?


svg polymer iron
person Christian    schedule 14.03.2016    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Наверное

<iron-icon icon="custom-icon:my-icon"></iron-icon>

должно быть

<iron-icon icon="custom:my-icon"></iron-icon>

(в соответствии с вашим примером my-icon должно быть nodejs, но я предполагаю, что ваш набор иконок содержит <g id="my-icon">)

или альтернативно

<iron-iconset-svg name="custom" size=4>

должно быть

<iron-iconset-svg name="custom-icon" size=4>
person Günter Zöchbauer    schedule 14.03.2016
comment
извините, это была моя ошибка копирования-вставки, я немного изменил свой код, как в примере, но я сделал все правильно, как вы сказали <iron-icon icon="custom:my-icon"></iron-icon>, но проблема все еще есть - person Christian; 15.03.2016
comment
Но это все еще не работает? Вы получаете какие-либо ошибки в консоли? - person Günter Zöchbauer; 15.03.2016
comment
нет, у меня нет ошибок, и в исходном html-коде похоже, что значок есть, но почему-то не отображается - person Christian; 15.03.2016
comment
Может быть, вам просто нужно задать цвет? - person Günter Zöchbauer; 15.03.2016
comment
нет, это правильно. У меня есть несколько объектов с иконками, некоторые из них из стандартной библиотеки (они отлично работают), а другие — пользовательские. Я думаю, что мой svg немного велик, и я его не вижу. может в этом причина? как я могу изменить размер файла svg? - person Christian; 15.03.2016
comment
Попробуйте увеличить size="4" до size="150" - person Günter Zöchbauer; 15.03.2016
comment
Да, это работает! большое тебе спасибо. Я думал, что чем больше значение, тем больше размер, а в этом случае наоборот или что? - person Christian; 15.03.2016
comment
Я сам наткнулся на это недавно :). Я думаю, что SVG viewport можно использовать для изменения фактического размера (не помню). - person Günter Zöchbauer; 15.03.2016