javascript - Highcharts 将图表呈现为纯黑色，并且在 'fill' 上缺少 `rect` 属性-6ren

javascript - Highcharts 将图表呈现为纯黑色，并且在 'fill' 上缺少 `rect` 属性

转载作者：行者123 更新时间：2023-11-28 14:40:15

我正在尝试 example of Highcharts就像我的申请中一样。但我只得到一个纯黑色矩形，如下图所示。

以下是我得到的输出:

<div id="activity-chart" data-highcharts-chart="0" style="height: 300px;">
  <div id="highcharts-tpw9bq1-0" dir="ltr" class="highcharts-container ">
    <svg version="1.1" class="highcharts-root" xmlns="http://www.w3.org/2000/svg" width="675" height="300" viewBox="0 0 675 300">
      <desc>Created with Highcharts 6.0.4</desc>
      <defs>
        <clipPath id="highcharts-tpw9bq1-1">
          <rect x="0" y="0" width="156" height="585"></rect>
        </clipPath>
      </defs>
      <rect class="highcharts-background" x="0.5" y="0.5" width="673" height="298" rx="0" ry="0"></rect>
      <rect class="highcharts-plot-background" x="80" y="42" width="585" height="156"></rect>
      <g class="highcharts-grid highcharts-xaxis-grid ">
        <path class="highcharts-grid-line" d="M 80 94.5 L 665 94.5" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 80 146.5 L 665 146.5" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 80 198.5 L 665 198.5" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 80 41.5 L 665 41.5" opacity="1"></path>
      </g>
      <g class="highcharts-grid highcharts-yaxis-grid ">
        <path class="highcharts-grid-line" d="M 79.5 42 L 79.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 152.5 42 L 152.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 225.5 42 L 225.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 298.5 42 L 298.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 372.5 42 L 372.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 445.5 42 L 445.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 518.5 42 L 518.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 591.5 42 L 591.5 198" opacity="1"></path>
        <path class="highcharts-grid-line" d="M 665.5 42 L 665.5 198" opacity="1"></path>
      </g>
      <rect class="highcharts-plot-border" x="79.5" y="41.5" width="586" height="157"></rect>
      <g class="highcharts-axis highcharts-xaxis ">
        <path class="highcharts-axis-line" d="M 79.5 42 L 79.5 198"></path>
        <path class="highcharts-tick" d="M 80 94.5 L 70 94.5" opacity="1"></path>
        <path class="highcharts-tick" d="M 80 146.5 L 70 146.5" opacity="1"></path>
        <path class="highcharts-tick" d="M 80 198.5 L 70 198.5" opacity="1"></path>
        <path class="highcharts-tick" d="M 80 41.5 L 70 41.5" opacity="1"></path>
      </g>
      <g class="highcharts-axis highcharts-yaxis ">
        <path class="highcharts-axis-line" d="M 80 198.5 L 665 198.5"></path>
        <text x="372.5" text-anchor="middle" transform="translate(0,0)" class="highcharts-axis-title" y="242">
          <tspan>Fruit eaten</tspan>
        </text>
      </g>
      <g class="highcharts-series-group">
        <g class="highcharts-series highcharts-series-0 highcharts-bar-series highcharts-color-0 highcharts-tracker" transform="translate(665,198) rotate(90) scale(-1,1) scale(1 1)" clip-path="url(#highcharts-tpw9bq1-1)">
          <rect x="131.5" y="512.5" width="13" height="73" class="highcharts-point highcharts-color-0"></rect>
          <rect x="79.5" y="585.5" width="13" height="0" class="highcharts-point highcharts-color-0"></rect>
          <rect x="27.5" y="293.5" width="13" height="292" class="highcharts-point highcharts-color-0"></rect>
        </g>
        <g class="highcharts-markers highcharts-series-0 highcharts-bar-series highcharts-color-0 " transform="translate(665,198) rotate(90) scale(-1,1) scale(1 1)" clip-path="none"></g>
        <g class="highcharts-series highcharts-series-1 highcharts-bar-series highcharts-color-1 highcharts-tracker" transform="translate(665,198) rotate(90) scale(-1,1) scale(1 1)" clip-path="url(#highcharts-tpw9bq1-1)">
          <rect x="115.5" y="219.5" width="13" height="366" class="highcharts-point highcharts-color-1"></rect>
          <rect x="63.5" y="73.5" width="13" height="512" class="highcharts-point highcharts-color-1"></rect>
          <rect x="11.5" y="366.5" width="13" height="219" class="highcharts-point highcharts-color-1"></rect>
        </g>
        <g class="highcharts-markers highcharts-series-1 highcharts-bar-series highcharts-color-1 " transform="translate(665,198) rotate(90) scale(-1,1) scale(1 1)" clip-path="none"></g>
      </g>
      <text x="338" text-anchor="middle" class="highcharts-title" y="21">
        <tspan>Fruit Consumption</tspan>
      </text>
      <text x="338" text-anchor="middle" class="highcharts-subtitle" y="43"></text>
      <g class="highcharts-legend" transform="translate(266,257)">
        <rect class="highcharts-legend-box" rx="0" ry="0" x="0.5" y="0.5" width="141" height="27" visibility="visible"></rect>
        <g>
          <g>
            <g class="highcharts-legend-item highcharts-bar-series highcharts-color-0 highcharts-series-0" transform="translate(8,3)">
              <text x="21" text-anchor="start" y="17">
                <tspan>Jane</tspan>
              </text>
              <rect x="1" y="4" width="14" height="14" rx="7" ry="7" class="highcharts-point"></rect>
            </g>
            <g class="highcharts-legend-item highcharts-bar-series highcharts-color-1 highcharts-series-1" transform="translate(80.984375,3)">
              <text x="21" y="17" text-anchor="start">
                <tspan>John</tspan>
              </text>
              <rect x="1" y="4" width="14" height="14" rx="7" ry="7" class="highcharts-point"></rect>
            </g>
          </g>
        </g>
      </g>
      <g class="highcharts-axis-labels highcharts-xaxis-labels ">
        <text x="65" text-anchor="end" transform="translate(0,0)" y="74" opacity="1">
          <tspan>Apples</tspan>
        </text>
        <text x="65" text-anchor="end" transform="translate(0,0)" y="126" opacity="1">
          <tspan>Bananas</tspan>
        </text>
        <text x="65" text-anchor="end" transform="translate(0,0)" y="178" opacity="1">
          <tspan>Oranges</tspan>
        </text>
      </g>
      <g class="highcharts-axis-labels highcharts-yaxis-labels ">
        <text x="80" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>0</tspan>
        </text>
        <text x="153.125" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>1</tspan>
        </text>
        <text x="226.25" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>2</tspan>
        </text>
        <text x="299.375" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>3</tspan>
        </text>
        <text x="372.5" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>4</tspan>
        </text>
        <text x="445.625" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>5</tspan>
        </text>
        <text x="518.75" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>6</tspan>
        </text>
        <text x="591.875" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>7</tspan>
        </text>
        <text x="660.6953125" text-anchor="middle" transform="translate(0,0)" y="220" opacity="1">
          <tspan>8</tspan>
        </text>
      </g>
      <text x="665" class="highcharts-credits" text-anchor="end" y="295">Highcharts.com</text>
    </svg>
  </div>
</div>

您可以在上面的代码中注意到，没有一个元素具有属性 fill。但在 JSFiddle 的示例输出中，您可以看到许多元素都具有属性 fill。您可以看到下面的输出:

<div id="container" style="height: 300px" data-highcharts-chart="0">
  <div id="highcharts-odm2fvi-0" dir="ltr" class="highcharts-container " style="position: relative; overflow: hidden; width: 599px; height: 300px; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
    <svg version="1.1" class="highcharts-root" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="599" height="300" viewBox="0 0 599 300">
      <desc>Created with Highcharts 6.0.4</desc>
      <defs>
        <clipPath id="highcharts-odm2fvi-1">
          <rect x="0" y="0" width="160" height="519" fill="none"></rect>
        </clipPath>
      </defs>
      <rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="599" height="300" rx="0" ry="0"></rect>
      <rect fill="none" class="highcharts-plot-background" x="70" y="46" width="519" height="160"></rect>
      <g class="highcharts-grid highcharts-xaxis-grid ">
        <path fill="none" class="highcharts-grid-line" d="M 70 99.5 L 589 99.5" opacity="1"></path>
        <path fill="none" class="highcharts-grid-line" d="M 70 153.5 L 589 153.5" opacity="1"></path>
        <path fill="none" class="highcharts-grid-line" d="M 70 206.5 L 589 206.5" opacity="1"></path>
        <path fill="none" class="highcharts-grid-line" d="M 70 46.5 L 589 46.5" opacity="1"></path>
      </g>
      <g class="highcharts-grid highcharts-yaxis-grid ">
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 69.5 46 L 69.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 134.5 46 L 134.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 199.5 46 L 199.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 264.5 46 L 264.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 329.5 46 L 329.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 393.5 46 L 393.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 458.5 46 L 458.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 523.5 46 L 523.5 206" opacity="1"></path>
        <path fill="none" stroke="#e6e6e6" stroke-width="1" class="highcharts-grid-line" d="M 589.5 46 L 589.5 206" opacity="1"></path>
      </g>
      <rect fill="none" class="highcharts-plot-border" x="70" y="46" width="519" height="160"></rect>
      <g class="highcharts-axis highcharts-xaxis ">
        <path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 70 99.5 L 60 99.5" opacity="1"></path>
        <path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 70 153.5 L 60 153.5" opacity="1"></path>
        <path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 70 206.5 L 60 206.5" opacity="1"></path>
        <path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 70 45.5 L 60 45.5" opacity="1"></path>
        <path fill="none" class="highcharts-axis-line" stroke="#ccd6eb" stroke-width="1" d="M 69.5 46 L 69.5 206"></path>
      </g>
      <g class="highcharts-axis highcharts-yaxis ">
        <text x="329.5" text-anchor="middle" transform="translate(0,0)" class="highcharts-axis-title" style="color:#666666;fill:#666666;" y="244">
          <tspan>Fruit eaten</tspan>
        </text>
        <path fill="none" class="highcharts-axis-line" d="M 70 206 L 589 206"></path>
      </g>
      <g class="highcharts-series-group">
        <g class="highcharts-series highcharts-series-0 highcharts-bar-series highcharts-color-0 highcharts-tracker " transform="translate(589,206) rotate(90) scale(-1,1) scale(1 1)" clip-path="url(#highcharts-odm2fvi-1)">
          <rect x="134.5" y="454.5" width="13" height="65" fill="rgb(124,181,236)" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-0 "></rect>
          <rect x="81.5" y="519.5" width="13" height="0" fill="#7cb5ec" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-0"></rect>
          <rect x="27.5" y="260.5" width="13" height="259" fill="#7cb5ec" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-0"></rect>
        </g>
        <g class="highcharts-markers highcharts-series-0 highcharts-bar-series highcharts-color-0 " transform="translate(589,206) rotate(90) scale(-1,1) scale(1 1)" clip-path="none"></g>
        <g class="highcharts-series highcharts-series-1 highcharts-bar-series highcharts-color-1 highcharts-tracker" transform="translate(589,206) rotate(90) scale(-1,1) scale(1 1)" clip-path="url(#highcharts-odm2fvi-1)">
          <rect x="118.5" y="195.5" width="13" height="324" fill="#434348" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-1"></rect>
          <rect x="65.5" y="65.5" width="13" height="454" fill="#434348" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-1"></rect>
          <rect x="11.5" y="324.5" width="13" height="195" fill="#434348" stroke="#ffffff" stroke-width="1" class="highcharts-point highcharts-color-1"></rect>
        </g>
        <g class="highcharts-markers highcharts-series-1 highcharts-bar-series highcharts-color-1 " transform="translate(589,206) rotate(90) scale(-1,1) scale(1 1)" clip-path="none"></g>
      </g>
      <text x="300" text-anchor="middle" class="highcharts-title" style="color:#333333;font-size:18px;fill:#333333;" y="24">
        <tspan>Fruit Consumption</tspan>
      </text>
      <text x="300" text-anchor="middle" class="highcharts-subtitle" style="color:#666666;fill:#666666;" y="45"></text>
      <g class="highcharts-legend" transform="translate(232,259)">
        <rect fill="none" class="highcharts-legend-box" rx="0" ry="0" x="0" y="0" width="134" height="26" visibility="visible"></rect>
        <g>
          <g>
            <g class="highcharts-legend-item highcharts-bar-series highcharts-color-0 highcharts-series-0" transform="translate(8,3)">
              <text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" y="15">
                <tspan>Jane</tspan>
              </text>
              <rect x="2" y="4" width="12" height="12" fill="#7cb5ec" rx="6" ry="6" class="highcharts-point"></rect>
            </g>
            <g class="highcharts-legend-item highcharts-bar-series highcharts-color-1 highcharts-series-1" transform="translate(76.390625,3)">
              <text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start">
                <tspan>John</tspan>
              </text>
              <rect x="2" y="4" width="12" height="12" fill="#434348" rx="6" ry="6" class="highcharts-point"></rect>
            </g>
          </g>
        </g>
      </g>
      <g class="highcharts-axis-labels highcharts-xaxis-labels ">
        <text x="55" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="77" opacity="1">
          <tspan>Apples</tspan>
        </text>
        <text x="55" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="131" opacity="1">
          <tspan>Bananas</tspan>
        </text>
        <text x="55" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="184" opacity="1">
          <tspan>Oranges</tspan>
        </text>
      </g>
      <g class="highcharts-axis-labels highcharts-yaxis-labels ">
        <text x="70" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">0</text>
        <text x="134.875" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">1</text>
        <text x="199.75" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">2</text>
        <text x="264.625" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">3</text>
        <text x="329.5" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">4</text>
        <text x="394.375" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">5</text>
        <text x="459.25" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">6</text>
        <text x="524.125" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">7</text>
        <text x="585.5234375" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="225" opacity="1">8</text>
      </g>
      <text x="589" class="highcharts-credits" text-anchor="end" style="cursor:pointer;color:#999999;font-size:9px;fill:#999999;" y="295">Highcharts.com</text>
      <g class="highcharts-label highcharts-tooltip highcharts-color-0" style="cursor:default;pointer-events:none;white-space:nowrap;" transform="translate(141,-9999)" opacity="0" visibility="visible">
        <path fill="none" class="highcharts-label-box highcharts-tooltip-box" d="M 3.5 0.5 L 64.5 0.5 C 67.5 0.5 67.5 0.5 67.5 3.5 L 67.5 41.5 C 67.5 44.5 67.5 44.5 64.5 44.5 L 3.5 44.5 C 0.5 44.5 0.5 44.5 0.5 41.5 L 0.5 28 -5.5 22 0.5 16 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5"
        isShadow="true" stroke="#000000" stroke-opacity="0.049999999999999996" stroke-width="5" transform="translate(1, 1)"></path>
        <path fill="none" class="highcharts-label-box highcharts-tooltip-box" d="M 3.5 0.5 L 64.5 0.5 C 67.5 0.5 67.5 0.5 67.5 3.5 L 67.5 41.5 C 67.5 44.5 67.5 44.5 64.5 44.5 L 3.5 44.5 C 0.5 44.5 0.5 44.5 0.5 41.5 L 0.5 28 -5.5 22 0.5 16 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5"
        isShadow="true" stroke="#000000" stroke-opacity="0.09999999999999999" stroke-width="3" transform="translate(1, 1)"></path>
        <path fill="none" class="highcharts-label-box highcharts-tooltip-box" d="M 3.5 0.5 L 64.5 0.5 C 67.5 0.5 67.5 0.5 67.5 3.5 L 67.5 41.5 C 67.5 44.5 67.5 44.5 64.5 44.5 L 3.5 44.5 C 0.5 44.5 0.5 44.5 0.5 41.5 L 0.5 28 -5.5 22 0.5 16 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5"
        isShadow="true" stroke="#000000" stroke-opacity="0.15" stroke-width="1" transform="translate(1, 1)"></path>
        <path fill="rgba(247,247,247,0.85)" class="highcharts-label-box highcharts-tooltip-box" d="M 3.5 0.5 L 64.5 0.5 C 67.5 0.5 67.5 0.5 67.5 3.5 L 67.5 41.5 C 67.5 44.5 67.5 44.5 64.5 44.5 L 3.5 44.5 C 0.5 44.5 0.5 44.5 0.5 41.5 L 0.5 28 -5.5 22 0.5 16 0.5 3.5 C 0.5 0.5 0.5 0.5 3.5 0.5"
        stroke="#7cb5ec" stroke-width="1"></path>
        <text x="8" style="font-size:12px;color:#333333;fill:#333333;" y="20">
          <tspan style="font-size: 10px">Apples</tspan>
          <tspan style="fill:#7cb5ec" x="8" dy="15">●</tspan>
          <tspan dx="0"> Jane: </tspan>
          <tspan style="font-weight:bold" dx="0">1</tspan>
        </text>
      </g>
    </svg>
  </div>
</div>

为什么我的代码缺少 fill 属性？

我在代码中使用vue.js。那么，这是原因吗？

最佳答案

您正在使用由 css 样式化的 highcharts 版本，因此填充(和其他属性)由 css 类定义。

我将你的代码粘贴到Codepen，并得到了黑色矩形。然后我粘贴https://code.highcharts.com/css/highcharts.css的内容到 css 部分，就在那里。

因此，您需要做的就是使 css 样式可用于您的应用程序。希望有帮助。

关于javascript - Highcharts 将图表呈现为纯黑色，并且在 'fill' 上缺少 `rect` 属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48238105/

文章推荐： javascript - 如何在 Phaser 游戏中添加 Div

文章推荐： php - 缩进文档，忽略问题

文章推荐： ios - tableview commit editingStyle 正在删除错误的条目

文章推荐： css - 学习div定位布局

highcharts - angular2-highcharts Highcharts 导出模块
如何将导出模块包含到 angular2 应用程序中？我尝试将以下脚本添加到 index.html 但没有任何反应。最佳答案从 Angular CLI 1.0-RC.1 和最新的 angular
highcharts - 下载 highchart 时需要 Highchart 水印图像
我正在为 Web 应用程序使用 HighCharts Javascript 库。当我下载 Highchart 时，我需要 Highchart 水印图像。我正在使用普通的 hicgchart 代码。
highcharts - HighChart 工具提示位置可以更改吗？
我是 highcharts 的新手。默认情况下，Highchart 在图表本身内显示工具提示。这是否可以在图表外部显示工具提示，并显示在与内部显示相同的位置。有帮助吗？最佳答案您可以定义自己的 d
highcharts - Highcharts 热图是否可以在一行中使用日期时间轴？
我正在尝试使用日期时间格式的数据创建 highcharts 热图。数据以小时为单位，持续数天。我不希望图表每天都环绕，但希望所有数据都在一条线上。具体来说，它用于显示每小时的云量百分比，因此每个热图
highcharts - Highcharts 导出按钮不显示
我正在用 angular 中的简单图形来验证 highcharts。但是导出按钮不显示。我在 html 页面中添加脚本: 并在图表中添加属性: export :true, navigat
highcharts - highchart 图表重绘方法不刷新图表
我很想知道为什么按钮 2 在这个 example 中不起作用在这个 jsfiddle 示例中，附加到按钮 1 的“更新”方法正在运行，但在我的原始代码中，“更新”也不起作用。它显示错误:“对象# 没
highcharts - Highchart 工具提示的边框样式
我正在尝试在 highcharts 中编辑工具提示的边框。我遇到的问题是我只想显示底部边框。例如，您可以执行以下操作: tooltip: {borderWidth: 10}//但问题是在整个工具提
highcharts - Highcharts 十字线可以显示在面积图顶部吗？
Highcharts的十字线可以显示在面积图的顶部而不是隐藏在其下方吗？这是问题jsfiddle.net/hHjZb/1286/的示例最佳答案更新: Highcharts现在已经实现了the O
highcharts - Highcharts 在导出中添加图例
在将图表导出为PNG时，我试图在饼图上添加图例。这是我的代码: var chart_23_106; $(document).ready(function () { chart_23_106 = ne
highcharts - Highchart - 如何在半圆饼图中创建附加的图像仪表
带三角规的半圆饼如何在图表顶部创建带有三角形仪表的上述半圆饼图。我的车速表可以工作，但不能满足需要。在highchart api中有没有办法使用三角形作为仪表，而不是车速表？谢谢最佳答案这
highcharts - Highcharts -气泡图需要较大的气泡
我们使用的是Highchart气泡图，但是，当气泡x和y在图中位于同一位置且气泡y较小时，将无法看到或单击得很少的气泡。有什么方法可以先绘制较大的气泡，然后在顶部绘制较小的气泡？还是说较小的始终位于
highcharts - 设置图表宽度， Highcharts
是否可以使用百分比设置 Highcharts 的宽度？每当调整页面大小时，图表应具有足够的响应速度以适合页面大小吗？ One Solution 这里的问题是我有3个图表需要并排显示，每次调整页面大小时
highcharts - 更新基本柱 Highcharts
我在更新基本列 Highcharts 时遇到问题。我从服务器返回的 json 数组是: [{"name":"positive","data":[18,35,32,38]},{"name":"nega
highcharts - highchart 中的重叠列
有没有办法创建重叠的列？例如在 this jsFiddle ，蓝色和红色列应如下所示相互重叠，蓝色在后面，红色在前面。澄清一下，我不想要堆叠的列，蓝色和红色列都应该从 xAxis (y=0) 开始
highcharts - Highcharts 自定义图例
如何自定义图例从对此最佳答案查看 Highcharts legend api 选项。您可以使用所需的 css 进一步自定义。使用适当的 svg 图像(背景颜色取自图表本身) legend: {
highcharts - Highchart 图案填充
我正在尝试使用模式作为列范围以允许条形图工作。图案出现但不使用预定义的图案，所以它只是纯蓝色。通常它使用已定义的条纹图案，并在散点图等上完美运行。这是一个片段，展示了我的意思: Highchar
highcharts - Highcharts 范围选择器可以使用非日期线性范围吗？
我正在使用 HighStock JS 库生成一个图表，该图表使用 xAxis 的线性序列(不是时间序列)。我仍然想使用范围选择器来缩放到我的线性系列中的预定范围。这可能吗？例如；说我的 xAxis
highcharts - 单系列向下钻取到多系列 Highcharts
我需要从一个系列向下钻取到多个系列。但是下钻 id 在一个系列上似乎是唯一的，这意味着我无法从单个系列下钻到多个系列；只有一个。我该如何解决这个问题？最佳答案可以使用 chart.addSingl
highcharts - Highcharts 列标签
我制作了一个带有分组和堆叠列的Highcharts图表，就像在这里的示例http://www.highcharts.com/demo/column-stacked-and-grouped一样。该示例显
highcharts - Highchart 滚动条位置
如何在 highcharts/highstock 中将滚动条位置设置为Left？如图表加载时的图像所示，滚动条自动右对齐。有没有办法将它定位到左侧？最佳答案我们可以通过将 min 设置为 0

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - Highcharts 将图表呈现为纯黑色，并且在 'fill' 上缺少 `rect` 属性