Предложения по манипулированию SVG-картой

Я работаю над картой родных языков Калифорнии для Википедии. Карта содержит области, каждая из которых соответствует языку. Оригинал выглядит так (щелкните его, чтобы увидеть SVG ):

Я хочу сделать «локаторские карты» для каждого из этих отдельных языков вручную (в Inkscape ), как этот, для языка Cahuilla (который имеет код языка cah ):

Излишне говорить, что делать это было бы болью в шее, если бы я произвел все 60-кратное в Inkscape.

Хуже того, всякий раз, когда я нахожу ошибку в оригинале, мне придется переделать весь набор локаторских карт. (И на самом деле я недавно понял, что в моем оригинале отсутствует один язык целиком. Извините Cupeño.)

Поэтому моя цель – автоматизировать этот процесс. У меня нет большого опыта обработки SVG или даже XML, поэтому я ищу рекомендации относительно того, какие библиотеки будут наиболее полезными. Я бы предпочел решения в Python, честно говоря, я не безнадежен на этом языке.

Подводя итог, мне необходимо:

Получите список ссылок на все формы языка в исходном файле SVG.

Для каждого языка в этом списке:

  1. изменить цвет фона для текущего языка

  2. положить поле вокруг языка

  3. дублируйте поле и масштабируйте его до заданного размера (я понимаю, что на этом этапе может быть сложно на самом деле «обрезать» окружающие фигуры, как это было в моем примере, – просто создание прямоугольника с формой языка на белом фоне быть достаточным.)

  4. поместите дубликат в верхнем правом углу

  5. сохраните все это в code.svg

Конечным продуктом будет 60 SVG-файлов с именем cah.svg и т. Д. Еще лучше, можно было бы сгенерировать весь shebang, если возникла необходимость в редактировании исходной карты (что вполне вероятно).

2 Solutions collect form web for “Предложения по манипулированию SVG-картой”

Я бы рекомендовал использовать Python и специально создавать расширения для Inkscape. Я не думаю, что вам действительно нужно 60 SVG, если вы действительно этого не хотите, потому что исходная карта будет иметь все, что вам нужно.

Я бы использовал Inkscape, чтобы переименовать различные регионы в один и тот же код языка, который вы будете использовать. Например, Cahuilla или path13882 в настоящее время path13882 в вашем файле SVG. Я бы переименовал его в cah или Cahuilla и повторил процесс для каждого из языковых регионов. Используйте Редактор \ XML-редактор, чтобы убедиться, что вы обновляете все пути.

После того, как вы обновили имена / идентификаторы, вы можете посмотреть скрипты SVG. Я бы просто создал карту javascript / ecmascript или словарь, в котором есть соответствующая информация для языка:

 var langaugeMap = {}; languageMap["cah"] = { name: "Cahuilla", color: "rgb(255, 0, 0)" }; languageMap["cup"] = { name: "Cupeño", color: "rgb(255, 64, 0)" }; // and so on -- this could even be generated from a CSV file or Excel, etc. // if the highlighted color is always the same, then you don't need it in the map // or use style sheets for an activeshape and inactiveshape // Put any information that is specific to a language in the map 

Затем вам просто нужно добавить функцию мыши, которая добавит и поместит ограничительную рамку и изменит цвет пути. Вот один из примеров событий и сценариев, хотя он довольно устарел. У Carto.net также есть пример интерактивной карты.

SVG будет выглядеть примерно так:

 <path style="fill:#800000;fill-opacity:1;display:inline" d="m 422.43078,517.40746 c 0.52151,0.006 1.10755,0.0374 1.75925,0.0825 3.82011,0.26462 5.01088,0.75501 5.75001,2.37491 0.51312,1.12355 2.4121,3.0097 4.22213,4.1946 3.906,2.55656 7.38824,2.07964 9.61517,-1.3194 2.12996,-3.25075 9.13451,-3.19196 13.61739,0.11545 1.77185,1.30707 4.04994,2.38037 5.06319,2.38041 1.01325,0 3.34593,0.92548 5.18421,2.06155 2.52816,1.56236 4.9918,2.09869 10.09889,2.19902 3.71359,0.0729 7.68145,0.64349 8.82374,1.26442 2.81717,1.53202 5.67633,1.42382 10.7693,-0.40133 4.97461,-1.78261 6.31161,-1.36525 17.10267,5.31063 3.39862,2.10239 6.90491,4.08094 7.7956,4.39801 2.46593,0.8776 4.55428,4.66976 3.95259,7.17971 -0.29359,1.22605 -0.75898,3.51121 -1.03349,5.07968 -0.27411,1.56855 -0.88382,3.33952 -1.35761,3.93621 -1.50842,1.89871 -20.98501,7.77151 -27.8945,8.41122 -3.66014,0.33879 -8.3091,1.04337 -10.32987,1.56676 -3.50666,0.90799 -3.81743,0.79746 -6.78388,-2.44089 -3.3486,-3.65594 -6.11308,-4.2716 -8.48815,-1.89661 -2.14408,2.14401 -1.85126,3.96434 1.0667,6.66846 1.40725,1.30409 1.85699,2.10446 1.00027,1.77571 -0.85672,-0.32883 -6.3937,-0.12213 -12.3033,0.46176 -5.9096,0.58386 -12.56062,1.27336 -14.78297,1.53381 -4.17058,0.4888 -5.09869,-0.37014 -2.61673,-2.42989 2.1563,-1.78956 1.74245,-2.63318 -1.65999,-3.36449 -1.69931,-0.36525 -4.94789,-1.90738 -7.213,-3.42496 -2.26473,-1.51754 -5.89662,-3.66823 -8.07583,-4.77731 -2.17921,-1.10923 -6.21922,-3.94186 -8.97721,-6.29463 -4.75318,-4.05478 -4.93682,-4.36681 -3.43604,-6.02527 0.96935,-1.07117 2.36209,-1.56397 3.5899,-1.26992 1.62639,0.38937 2.49494,-0.41237 4.59588,-4.24958 1.42481,-2.60257 2.23686,-4.95457 1.80316,-5.22266 -0.4337,-0.26805 -1.06784,-3.14557 -1.40725,-6.39358 -0.33978,-3.24797 -1.19001,-6.79064 -1.89134,-7.87242 -1.74322,-2.68957 -1.2114,-3.65437 2.44111,-3.61188 l 0,0 z" id="cah" inkscape:label="#cah" onmouseover="highlightRegion(evt);" onmouseout="restoreRegion(evt);" /> 

Для любой автоматизации с SVG-файлом я бы использовал расширения Inkscape. Посмотрите вики Inkscape в разделе «Учебники / расширения для разработчиков». В противном случае SVG по-прежнему является XML, поэтому, если вы назвали свои языковые регионы в исходном файле с отличительным именем, вы можете использовать Python для анализа XML и сохранения каждого региона пути / языка в отдельный файл.

Вот пример использования вашей карты. Вы можете щелкнуть любой элемент, чтобы получить ограничивающий пакет, это можно использовать для мини-просмотра viewBox (с некоторой настройкой). Как вы видите, это не добавляет много кода на карту, всего пару элементов. Когда у вас есть все viewBoxes, вы можете обновить атрибут miniview 'viewBox' на лету, используя javascript.

Для окраски выбранной фигуры я бы предложил добавить элемент <use> внутри miniview <svg> который имеет заливку, которая переопределяет любую заливку, используемую на основной карте (вам может потребоваться использовать правило таблицы стилей для этого, чтобы сделать уверен, что у него высокая специфичность, например добавление #miniview .activeshape { fill: red !important } . Пусть <use> указывает на выбранную фигуру и убедитесь, что вы добавили class="activeshape" в фигуре, на которую вы указываете.

По крайней мере, это должно начаться, надеюсь, что это поможет 🙂

  • Python получает координаты векторного пути из файла .svg
  • Отображение SVG в ноутбуке IPython из функции
  • Библиотека для расчета путей SVG
  • Простой графический API с прозрачностью, полигонами, считыванием пикселей изображения?
  • PIL и векторная графика
  • Может ли Django dev сервер правильно обслуживать SVG?
  • Данные веб-соскабливания с интерактивной диаграммы
  • Преобразование SVG в PNG в Python
  • Heatmap в matplotlib с векторным форматом
  • Как визуализировать * части * файла svg?
  • интерактивный _standalone_ вывод от matplotlib
  •  
    Interesting Posts for Van-Lav

    Как я могу форматировать стеки стека исключения в протоколе Python?

    pandas находят ряды среди рядов

    Яйца в пути до переменной окружения PYTHONPATH

    Сортировка dict в цикле jinja2

    Отображение текстур 2D RGB с истинным цветом в 3D-графике?

    Является ли список Python гарантированным, чтобы его элементы оставались в том порядке, в котором они были вставлены?

    Как правильно использовать jsonify () для flask для возврата json?

    Python – простейший и самый последовательный способ получить текущее время, соответствующее времени в UTC?

    Как я могу скрыть окно консоли при замораживании приложений wxPython с помощью cxFreeze?

    Доступ к непоследовательным элементам списка или строки в python

    Проверьте, что список кортежей имеет кортеж с 1-м элементом в качестве определенной строки

    Переместить заданную строку до конца DataFrame

    Как вывести имя индекса столбца в dataframe

    Создайте набор запросов django на основе ключей dict

    Быстрые опции (или, возможно, Haskell's) в Python?

    Python - лучший язык программирования в мире.