семиотический - strokeWidth управляет шириной обводки и количеством линий заливки - PullRequest
2 голосов
/ 22 июня 2019

Скажите, что у меня есть этот семиотический код (см. Как получить семиотический график для отображения в браузере ):

import React from "react"

import OrdinalFrame from "semiotic/lib/OrdinalFrame"
const frameProps = { 
/* --- Data --- */
  data: [5,8,2,6,4 ],

/* --- Size --- */
  size: [600,600],
  margin: { left: 100, bottom: 90, right: 10, top: 40 },

/* --- Layout --- */
  type: "bar",
  oPadding: 10,

/* --- Customize --- */
  style: function(e,t){return{fill:t<5?"url(#gradient)":"url(#triangle)",
        fillOpacity:4.5,
        strokeWidth:1,
        stroke: "black",
        strokeOpacity:0.5}},
  additionalDefs: [
    <pattern
      key="triangle"
      id="triangle"
      width="10"
      height="10"
      patternUnits="userSpaceOnUse"
    >
      <rect fill={"#9fd0cb"} width="10" height="10" />
      <circle fill={"#7566ff"} r="5" cx="3" cy="3" />
    </pattern>,
    <linearGradient key="gradient" x1="0" x2="0" y1="0" y2="1" id="gradient">
      <stop stopColor={"#dc58e5"} offset="0%" />
      <stop stopColor={"#1111ff"} offset="100%" />
    </linearGradient>
  ],
  renderMode: ("sketchy"),

    title: (
    <text textAnchor="middle">
      Theaters showing <tspan fill={"#ac58e5"}>Ex Machina</tspan> vs{" "}
      <tspan fill={"#E0488B"}>Far from the Madding Crowd</tspan>
    </text>  ),

}

const XYFrameWrapper = () => {
  return <OrdinalFrame {...frameProps} />
}

export default XYFrameWrapper;

Я заметил, что опция strokeWidth изменяет обаширина штриха (контур полос), а также количество линий заливки.Например, если strokeWidth установлено на 1, оно дает много строк, но если оно установлено на 10, это дает очень мало строк.Как я могу заставить его контролировать только ширину хода?В связи с этим я не могу понять, как получить очень мало строк только с опцией fillOpacity.Я могу сделать это, используя опцию strokeWidth, но, конечно, это делает линию ширины обводки слишком большой.Как я могу получить очень мало линий, но иметь маленькую линию ширины штриха?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...