2008-10-27 12 views
7

Я работаю над небольшим приложением, где я могу сгенерировать список штрих-кодов. У меня на компьютере установлены правильные шрифты. Прямо сейчас я печатаю их непосредственно на веб-странице, и он работает правильно в Chrome и IE 7, но не в Firefox. Кто-нибудь знает, что Firefox будет делать иначе, чем IE и Chrome?Веб-страницы и штрих-коды шрифтов

Вот мой код:

<html> 
    <head> 
     <title>Barcode Font Test</title> 

     <style type="text/css" media="screen"> 
      .barcode { font-family: "wasp 39 m", verdana, calibri; font-size: 36pt; } 
     </style> 
    </head> 

    <body> 
     <div class="barcode">*574656*</div> 
    </body> 
</html> 

EDIT: я, вероятно, следовало бы отметить, что это больше личного проекта в данный момент и не предназначены, чтобы быть выпущен к миру. Хотя я буду принимать решение, которое работает, я хотел бы что-то, что не включает Javascript/Flash/и т. Д.

+0

Если это персональный проект, зачем ему нужно работать в кросс-браузере? – eyelidlessness 2008-10-27 19:59:42

+0

Кросс-браузер наверняка не нужен. Тем не менее, я использую Firefox и не понимаю, почему это был единственный браузер, который вызывал у меня проблемы. – 2008-10-27 20:17:25

+0

Я столкнулся с этой коллекцией [@Font Face Barcode Web Fonts] (http://www.barcoderesource.com/barcodewebfont.shtml) по http://www.barcoderesource.com ранее. – 2012-01-13 06:20:29

ответ

3

Более простым решением может быть создание серверной части изображений для создания штрих-кодов. Таким образом, вам не нужно полагаться на пользователя, у которого установлен шрифт, и вам не нужно получать доступ к шрифту в вашем html.

2

Использование нестандартных шрифтов на веб-страницах - большая боль в заднице. Чтобы было проще, вы можете использовать sIFR или новый typeface.js.

Редактировать: Это было действительно 4 года назад, когда оно было опубликовано, но его больше нет. Я оставлю его здесь для потомков, но не принимайте его как правильный ответ.

+0

Правильно, но это не проблема, которую испытывает Роди. Он сказал, что у него есть этот шрифт, установленный на его компьютере, и возникает вопрос, что его тесты были выполнены на его локальной машине. – hangy 2008-10-27 18:31:24

3

В компании, с которой я работаю сейчас, мы используем BarCode.dll из lesnikowski.com. Он генерирует изображения штрих-кода. Это не зависит от того, установлен ли шрифт на клиентском ПК и работает со всеми браузерами.

Надеюсь, это поможет.

1

У нас такая же проблема в моей компании. К счастью, только 1-2 людям когда-либо понадобится использовать шрифты штрих-кода.

Мы обнаружили, что когда они получили новый компьютер, шрифты не работали ни в каких браузерах. Им нужно было открыть клиентское приложение (например, Word), выбрать шрифт штрих-кода и сделать некоторую типизацию для «инициализации» этого шрифта.

Лучшим решением, я думаю, является создание изображения штрих-кода на сервере по требованию. Проблема с этим решением может привести к удалению старых изображений. На мой взгляд, это решение требует большей работы, но окупается с меньшими текущими проблемами и обслуживанием, чем решение на стороне клиента.

6

Существует несколько форматов штрих-кода. Некоторые из них просты, а некоторые могут стать очень сложными. Один из самых простых в использовании, если он подходит вашему приложению, - это 3 из 9 штрих-кодов. Он не сжимается и имеет отношение 1 к 1 с символами штрих-кода. Существует два варианта этого, только числовой и расширенный набор, который включает альфу. Я продолжу рассмотрение вопроса о том, что вы можете использовать этот формат. (Из вашего примера кода, похоже, это то, что вы используете). Для самой простой реализации придерживайтесь только числовых данных. Затем вам потребуется только одиннадцать символов (0-9 и астриск). Посмотрите на определение существующего шрифта 3 из 9. (Для некоммерческого использования, найдите шрифт под названием FREE3OF9. Вы можете использовать его в качестве базы для своего приложения ...)

Далее, утомительная часть - больше работы для вас спереди, но отображается практически в любом браузере , Если вы не можете найти какой-либо он-лайн, сверните изображение GIF (или BMP или PNG) для каждого символа. (Вспомните, чтобы включить правильное белое пространство в правой части символа, чтобы дистанцировать его от следующего символа!) Он должен быть только одним пикселем. Когда придет время, чтобы отобразить штрих-код, введите символы вместе как <IMG>, которые находятся рядом друг с другом. 3 из 9 требует, чтобы символы в штрих-коде были окружены или завернуты с помощью astrisk (в любом случае это астриск в шрифте FREE3OF9) на каждом конце. Установите высоту <IMG> на что-то достаточно высокое, чтобы удовлетворить вашу распечатку.

Таким образом, на клиенте не требуется установка шрифтов, но большинство декодеров штрих-кода могут считывать итоговую графику.

Ваш пример (*574656*) может выглядеть следующим образом: 574656 http://img390.imageshack.us/img390/9168/574656vx9.png

(ну, не совсем так - это твердый графический вместо композиции нескольких поточных одиночной графики, но вы получите идею)

отдельные числовые графики выглядеть следующим образом: (хотя, они не являются "очищены" пока)

**

00 http://img390.imageshack.us/img390/9618/3o9bc_0.png

11 http://img390.imageshack.us/img390/4474/3o9bc_1.png

22 http://img390.imageshack.us/img390/4571/3o9bc_2.png

33 http://img390.imageshack.us/img390/4702/3o9bc_3.png

44 http://img390.imageshack.us/img390/8272/3o9bc_4.png

55 http://img390.imageshack.us/img390/9127/3o9bc_5.png

66 http://img390.imageshack.us/img390/3672/3o9bc_6.png

77 http://img390.imageshack.us/img390/7348/3o9bc_7.png

88 http://img390.imageshack.us/img390/2807/3o9bc_8.png

99 http://img390.imageshack.us/img390/2862/3o9bc_9.png

и изменения кода может выглядеть следующим образом:

<html>  
    <head>   
     <title>Barcode Font Test</title>   
    </head>  
    <body> 
     <img src="3o9cb_ast.png" alt="*"/>  
     <img src="3o9cb_5.png" alt="5"/> 
     <img src="3o9cb_7.png" alt="7"/> 
     <img src="3o9cb_4.png" alt="4"/> 
     <img src="3o9cb_6.png" alt="6"/> 
     <img src="3o9cb_5.png" alt="5"/> 
     <img src="3o9cb_6.png" alt="6"/> 
     <img src="3o9cb_ast.png" alt="*"/> 
    </body> 
</html> 

Я использовал SearchFreeFonts.com как ресурс, чтобы освежить свою память о том, как были отформатированы 3 из 9 символов штрих-кода. Эти графики изначально находятся на этом сайте.