Как можно добавить несколько изображений плитки в ReactOpenSeadragon - PullRequest
0 голосов
/ 04 сентября 2018

Вот код, который я пытаюсь, но он не работает

class App extends Component {

  state =
  {
    id: "OSD",
    getImageURL: 'http://cdm16022.contentdm.oclc.org/utils/ajaxhelper',
    osdConfig: {
      setStrings: [{ name: 'Tooltips.Home', value: 'Reset' }],
      defaultZoomLevel: 0,
      tileSources: [
        {
          Image: {
            xmlns: "http://schemas.microsoft.com/deepzoom/2008",
            Url: "https://openseadragon.github.io/example-images/highsmith/highsmith_files/",
            Format: "jpg",
            Overlap: "0",
            TileSize: "256",
            Size: {
              Height: "9221",
              Width: "7026"
            }
          }
        },
        {
          Image: {
            xmlns: "http://schemas.microsoft.com/deepzoom/2008",
            Url: "https://openseadragon.github.io/example-images/highsmith/highsmith_files/",
            Format: "jpg",
            Overlap: "1",
            TileSize: "256",
            Size: {
              Height: "621",
              Width: "526"
            }
          }
        }

      ],
    },
    pages: [
      {
        id: 0,
      },
      {
        id: 1,
      }

    ],
  };






  render() {

    return (
      <div>
        <Slider click={this.clickSlider} />
        <div className="wrapper">
        </div>
        <ReactOpenSeadragon {...this.state} />
      </div>
    );
  }
}

export default App;

1 Ответ

0 голосов
/ 10 сентября 2018

Я не знаком с ReactOpenSeadragon, но у меня есть несколько наблюдений на уровне OpenSeadragon. Эти два тайла-источника будут накладываться непосредственно друг на друга, если вы не расположите их как-нибудь. Самый простой способ - добавить collectionMode: true к вашим параметрам (чтобы они отображались рядом друг с другом) или sequenceMode: true (чтобы они отображались в виде страниц, к которым вы можете перейти с помощью кнопок со стрелками в пользовательском интерфейсе).

Также defaultZoomLevel: 0 кажется неправильным; zoom никогда не должен быть 0. Возможно, просто удалите это полностью сейчас.

...