主页 / coding / 问题 / 78827600
Accepted
Vlad
Asked: 2024-08-03 08:36:15 +0800 CST

用于点标记的 SVG - 哪种 SVG 格式有效？

  • 772

我已经简化了这里的示例，为点标记绘制一个 svg（图片），如下所示：

svg 点标记 工作

但是尝试用另一条路径（pic2）替换 SVG 路径会导致以下结果： 不工作图片

它应该显示一棵圣诞树： 圣诞树

这是包含两个 svg 的列表的代码，看来工作时的间距不同？

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "config": {"view": {"stroke": ""}},
  "width": 800,
  "height": 200,
  "data": {
    "values": [
      {"country": "Great Britain", "animal": "pic", "col": 3}
    ]
  },
  "mark": {"type": "point", "filled": true},
  "encoding": {
    "x": {"field": "col", "type": "ordinal", "axis": null},
    "y": {"field": "animal", "type": "ordinal", "axis": null},
    "row": {"field": "country", "header": {"title": ""}},
    "shape": {
      "field": "animal",
      "type": "nominal",
      "scale": {
        "domain": ["pic", "pic2"],
        "range": [
          "M1.7 -1.7h-0.8c0.3 -0.2 0.6 -0.5 0.6 -0.9c0 -0.6 -0.4 -1 -1 -1c-0.6 0 -1 0.4 -1 1c0 0.4 0.2 0.7 0.6 0.9h-0.8c-0.4 0 -0.7 0.3 -0.7 0.6v1.9c0 0.3 0.3 0.6 0.6 0.6h0.2c0 0 0 0.1 0 0.1v1.9c0 0.3 0.2 0.6 0.3 0.6h1.3c0.2 0 0.3 -0.3 0.3 -0.6v-1.8c0 0 0 -0.1 0 -0.1h0.2c0.3 0 0.6 -0.3 0.6 -0.6v-2c0.2 -0.3 -0.1 -0.6 -0.4 -0.6z",
          "M256 0L266.969 30.766L299.641 31.703L273.766 51.656L282.969 83L256 64.563L229.031 83L238.234 51.656L212.359 31.703L245.016 30.766z M387.281 405.297L327.781 313.344L361.016 313.344L301.203 220.875L334.094 220.875L256 100.156L177.906 220.875L210.781 220.875L150.984 313.344L184.219 313.344L124.719 405.297z M229.328 430.313h53.344v81.688H229.328Z"
        ]
      },
      "legend": null
    },
    "opacity": {"value": 1},
    "size": {"value": 200}
  }
}
powerbi

1 个回答

  1. Best Answer

    它确实显示了一棵圣诞树，不是吗？如果您说的是大小和位置，那么这些是在 SVG 中编码的。您可以将 SVG 代码粘贴到类似此处的编辑器中：https://editor.method.ac/，然后调整大小或位置。

    <svg width="800" height="600" xmlns="http://www.w3.org/2000/svg">
 <title>Drawing</title>

 <g id="Layer_1">
  <title>Layer 1</title>
  <path d="m173.00001,16l4.03405,11.31476l12.01573,0.3446l-9.51601,7.33808l3.38457,11.52733l-9.91835,-6.78055l-9.91835,6.78055l3.38457,-11.52733l-9.51601,-7.33808l12.01021,-0.3446l4.03957,-11.31476l0.00002,0zm48.281,149.05543l-21.88222,-33.81741l12.22278,0l-21.99733,-34.00718l12.09627,0l-28.72051,-44.39663l-28.72051,44.39663l12.09039,0l-21.99145,34.00718l12.22278,0l-21.88222,33.81741l96.56201,0l0.00001,0zm-58.09012,9.20009l19.61824,0l0,30.04227l-19.61824,0l0,-30.04227z" id="svg_3" stroke="#000" fill="none"/>
 </g>
</svg>
    • 1

相关问题